.cpc-page {
 --cpc-ink:#283252; --cpc-muted:#77809a; --cpc-line:#e3e8f0;
 --cpc-soft:#f6f8fb; --cpc-card:#fff; --cpc-primary:#ff596f;
 background:#f5f6f8; color:var(--cpc-ink);
}
.cpc-page [hidden] { display:none!important; }
.cpc-page .cpc-card {
 max-width:1480px; margin:0 auto; overflow:hidden; background:var(--cpc-card);
 border:1px solid var(--cpc-line); border-radius:14px; box-shadow:0 10px 30px #2832520f;
}
html.dashboard-wide-layout .cpc-page .page-content-wrapper,
html.dashboard-wide-layout .cpc-page .page-content,
html.dashboard-wide-layout .cpc-page .page-content-inner,
html.dashboard-wide-layout .cpc-page .cpc-card { width:100%; max-width:none; }
.cpc-page .cpc-head { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.cpc-page .cpc-page-head { padding:20px 22px 18px; border-bottom:1px solid var(--cpc-line); background:linear-gradient(135deg,#fff,#fffaf7); }
.cpc-page .cpc-title { min-width:0; flex:1 1 300px; }
.cpc-page .cpc-eyebrow { display:block; color:#e88937; font-size:11px; font-weight:800; letter-spacing:.5px; }
.cpc-page h1 { margin:4px 0; font-size:20px; line-height:1.4; font-weight:800; color:var(--cpc-ink); }
.cpc-page h2,.cpc-page h3 { color:var(--cpc-ink); font-size:14px; font-weight:800; line-height:1.4; margin:0; }
.cpc-page h3 { margin:20px 0 12px; }
.cpc-page .cpc-subtitle { color:var(--cpc-muted); font-size:12px; line-height:1.6; margin:4px 0 0; }
.cpc-page .cpc-body { padding:18px 22px 22px; }
.cpc-page .cpc-actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.cpc-page .cpc-button {
 box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; gap:7px;
 height:36px; min-height:36px; border:1px solid var(--cpc-line); border-radius:999px;
 background:var(--cpc-card); color:var(--cpc-ink); font-size:13px; font-weight:700; line-height:1;
 padding:0 14px; cursor:pointer; text-decoration:none; white-space:nowrap;
}
.cpc-page .cpc-button:hover { border-color:#c7cfde; background:var(--cpc-soft); }
.cpc-page .cpc-primary { color:#fff; background:var(--cpc-primary); border-color:var(--cpc-primary); }
.cpc-page .cpc-primary:hover { color:#fff; background:#ed4b63; border-color:#ed4b63; }
.cpc-page button:disabled { opacity:.45; cursor:default; }
.cpc-page .cpc-button:focus-visible,.cpc-page .cpc-reset:focus-visible { outline:2px solid #ff596f; outline-offset:3px; }
.cpc-page .cpc-icon-button { width:36px; min-width:36px; padding:0; }
.cpc-page .cpc-mode-badge { color:#b36b26; background:#fff2e6; border-radius:999px; font-size:11px; font-weight:700; padding:6px 10px; white-space:nowrap; }
.cpc-page .cpc-summary { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:18px; }
.cpc-page .cpc-stat { box-sizing:border-box; flex:0 0 166px; padding:14px 16px; border:1px solid var(--cpc-line); border-radius:10px; display:flex; flex-direction:column; gap:9px; }
.cpc-page .cpc-stat > span { color:var(--cpc-muted); font-size:12px; font-weight:600; }
.cpc-page .cpc-stat strong { font-size:22px; font-weight:800; color:var(--cpc-ink); line-height:1.3; }
.cpc-page .cpc-money { white-space:nowrap; font-variant-numeric:tabular-nums; }
.cpc-page .cpc-money small { font-size:70%; }
.cpc-page .cpc-filters { padding:16px; background:var(--cpc-soft); border:1px solid #edf0f5; border-radius:10px; margin-bottom:20px; }
.cpc-page .cpc-section-title { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.cpc-page .cpc-section-title > i { color:#d97732; font-size:14px; }
.cpc-page .cpc-reset { height:36px; padding:0 0 0 10px; border:0; background:transparent; color:#df5369; font-size:12px; font-weight:600; cursor:pointer; }
.cpc-page .cpc-filter-grid { display:grid; grid-template-columns:repeat(auto-fill,171px); gap:14px; margin-top:16px; }
.cpc-page .cpc-filter-grid label,.cpc-page .cpc-mode-control,.cpc-page .cpc-sales-form label { display:flex; flex-direction:column; gap:7px; color:#59637b; font-size:12px; font-weight:700; }
.cpc-page label { margin:0; }
.cpc-page input,.cpc-page select { box-sizing:border-box; height:36px; border:1px solid #dfe3ea; border-radius:7px; background:var(--cpc-card); padding:0 10px; max-width:100%; font-size:13px; color:var(--cpc-ink); }
.cpc-page input:focus,.cpc-page select:focus { outline:0; border-color:#eeaa78; box-shadow:0 0 0 3px #fe8e3c14; }
.cpc-page .cpc-filter-grid input,.cpc-page .cpc-filter-grid select { width:100%; min-width:0; }
.cpc-page .cpc-toolbar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; margin-bottom:12px; }
.cpc-page .cpc-tabs { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.cpc-page .cpc-selected { color:#c6455c; border-color:#f7b7c2; background:#fff2f4; }
.cpc-page .cpc-selected:hover { color:#c6455c; border-color:#ff596f; background:#fff2f4; }
.cpc-page .cpc-result-count { font-size:12px; color:var(--cpc-muted); }
.cpc-page .cpc-search { position:relative; width:300px; max-width:100%; margin-bottom:12px; }
.cpc-page .cpc-search > i { position:absolute; left:12px; top:12px; font-size:12px; color:var(--cpc-muted); pointer-events:none; }
.cpc-page .cpc-search input { width:100%; padding-left:32px; }
.cpc-page .cpc-table-shell { border:1px solid var(--cpc-line); border-radius:10px; max-height:62vh; overflow:auto; }
.cpc-page table { width:100%; border-collapse:separate; border-spacing:0; font-size:13px; white-space:nowrap; }
.cpc-page thead { position:sticky; top:0; z-index:1; background:#f5f7fb; }
.cpc-page th { background:#f5f7fb; color:#59637b; text-align:left; font-size:12px; font-weight:700; padding:13px 14px; border-bottom:1px solid var(--cpc-line); }
.cpc-page td { padding:13px 14px; border-bottom:1px solid #edf0f5; vertical-align:middle; color:var(--cpc-ink); }
.cpc-page tr:last-child td { border-bottom:0; }
.cpc-page tbody tr:hover { background:#fcfcfe; }
.cpc-page td a { color:#db5268; }
.cpc-page .cpc-number { text-align:right; font-variant-numeric:tabular-nums; }
.cpc-page .cpc-action-cell { width:100px; text-align:right; }
.cpc-page .cpc-product-name { min-width:230px; white-space:normal; }
.cpc-page .cpc-product-name small { display:block; color:var(--cpc-muted); margin-top:5px; }
.cpc-page .cpc-status { display:inline-block; border-radius:999px; padding:4px 9px; background:#f1f3f6; color:#77809a; font-size:12px; line-height:1.4; }
.cpc-page .cpc-status-confirmed { color:#247246; background:#eaf7ef; }
.cpc-page .cpc-status-review { color:#985b11; background:#fff0dd; }
.cpc-page .cpc-status-pending { color:#3973ad; background:#eef5fc; }
.cpc-page .cpc-pagination { display:flex; justify-content:flex-end; align-items:center; gap:12px; margin-top:16px; color:var(--cpc-muted); font-size:12px; }
.cpc-page .cpc-help { color:var(--cpc-muted); font-size:12px; margin:10px 0 0; line-height:1.7; }
.cpc-page .cpc-report-note { display:flex; align-items:flex-start; gap:8px; margin-top:18px; padding-top:14px; border-top:1px solid #edf0f5; }
.cpc-page .cpc-report-note > i { color:#9aa3b4; font-size:13px; margin-top:3px; }
.cpc-page .cpc-report-note .cpc-help { margin:0; }
.cpc-page .cpc-empty { padding:45px 20px; text-align:center; border:1px dashed var(--cpc-line); border-radius:10px; color:var(--cpc-muted); }
.cpc-page .cpc-empty > i { display:block; margin-bottom:12px; color:#c5cbda; font-size:30px; }
.cpc-page .cpc-empty p { color:var(--cpc-muted); font-size:13px; line-height:1.6; }
.cpc-page #cpc-loading > i,.cpc-page #cpc-sales-loading > i { animation:cpc-spin 1.2s linear infinite; }
@keyframes cpc-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .cpc-page #cpc-loading > i,.cpc-page #cpc-sales-loading > i { animation:none; } }
.cpc-page #cpc-message { color:#b42318; background:#fff2ef; border:1px solid #f8d6ce; border-radius:8px; font-size:12px; line-height:1.6; padding:10px 12px; margin:0 0 16px; }
.cpc-page #cpc-message.is-success { color:#247246; background:#effaf3; border-color:#d0ecda; }
.cpc-page .cpc-section-heading { margin-bottom:20px; }
.cpc-page .cpc-mode-control { max-width:300px; }
.cpc-page .cpc-rule-input { display:flex; gap:12px; margin-bottom:10px; }
.cpc-page .cpc-rule-input select { width:230px; }
.cpc-page .cpc-rule-input input { width:120px; }
.cpc-page .cpc-product-rule { display:flex; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid #edf0f5; flex-wrap:wrap; }
.cpc-page .cpc-product-rule span { flex:1; min-width:200px; }
.cpc-page .cpc-product-rule input { width:100px; }
.cpc-page .cpc-settings-footer { margin-top:24px; justify-content:flex-end; }
.cpc-page .cpc-sales-form { display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap; margin-top:16px; }
.cpc-page .cpc-sales-form input[type=text] { width:260px; }
.cpc-page .cpc-sales-form #cpc-sales-code { width:171px; text-transform:uppercase; }
.cpc-page .cpc-sales-form select { width:130px; }
.cpc-page .cpc-sales-name { width:45%; min-width:180px; white-space:normal; word-break:break-word; font-weight:600; }
.cpc-page .cpc-sales-code { font-weight:700; color:#5c6986; }
.cpc-page .cpc-inline-control { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--cpc-muted); }
.cpc-page .cpc-inline-control select { min-width:130px; }
.is-dark .cpc-page { --cpc-ink:#e0e4f1; --cpc-muted:#a2a9bd; --cpc-card:#242735; --cpc-soft:#2c3041; --cpc-line:#3a4054; background:#202331; }
.is-dark .cpc-page .cpc-page-head { background:linear-gradient(135deg,#242735,#2b2932); }
.is-dark .cpc-page th,.is-dark .cpc-page thead { background:#2c3041; color:#bcc4d7; }
.is-dark .cpc-page label { color:#bcc4d7; }
.is-dark .cpc-page td,.is-dark .cpc-page .cpc-report-note,.is-dark .cpc-page .cpc-filters { border-color:var(--cpc-line); }
.is-dark .cpc-page tbody tr:hover { background:#2c3041; }
@media(max-width:700px) {
 .cpc-page .cpc-page-head { padding:18px 16px; }
 .cpc-page .cpc-body { padding:16px; }
 .cpc-page .cpc-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .cpc-page .cpc-stat { flex-basis:calc(50% - 6px); }
 .cpc-page .cpc-filters { padding:14px; }
 .cpc-page .cpc-filter-heading > .cpc-actions { width:100%; }
 .cpc-page .cpc-filter-heading #cpc-filter-toggle { margin-left:auto; }
 .cpc-page .cpc-sales-form label { flex:1 1 170px; }
 .cpc-page .cpc-sales-form input[type=text],.cpc-page .cpc-sales-form #cpc-sales-code,.cpc-page .cpc-sales-form select { width:100%; }
 .cpc-page .cpc-search { width:100%; }
}
/* Sales directory: one toolbar and modal forms. */
.cpc-page #cpc-sales-table th { padding:4px 14px; }
.cpc-page .cpc-sort-button { display:inline-flex; align-items:center; gap:8px; height:36px; padding:0; border:0; border-radius:999px; background:transparent; color:inherit; font:inherit; font-weight:700; cursor:pointer; }
.cpc-page .cpc-sort-button i { color:#9aa3b4; font-size:11px; }
.cpc-page .cpc-sort-button:hover,.cpc-page .cpc-sort-button.is-sorted i { color:#df5369; }
.cpc-page .cpc-sort-button:focus { outline:none; box-shadow:none; }
.cpc-page .cpc-sort-button:focus-visible { text-decoration:underline; text-underline-offset:4px; }
.cpc-page .cpc-directory-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.cpc-page .cpc-directory-toolbar .cpc-search { flex:1 1 240px; max-width:350px; margin:0; }
.cpc-page .cpc-directory-toolbar .cpc-inline-control { flex:0 0 auto; }
.cpc-page .cpc-row-actions { display:flex; justify-content:flex-end; gap:8px; }
.cpc-page .cpc-sales-delete { color:#df5369; }
.cpc-page.cpc-dialog { background:transparent; z-index:110; }
.cpc-dialog .modal-background { background:rgba(23,31,49,.42); }
.cpc-page.cpc-dialog .modal-content { width:520px; max-width:calc(100vw - 32px); max-height:calc(100vh - 40px); margin:0; padding:0; overflow:visible; background:transparent; border:0; box-shadow:none; }
.cpc-dialog .modal-card { margin:0; width:100%; max-height:calc(100vh - 40px); overflow:hidden; border:1px solid var(--cpc-line); border-radius:14px; background:var(--cpc-card); box-shadow:0 20px 60px #17203333; }
.cpc-dialog.h-modal .modal-content .modal-card .modal-card-head { padding:18px 20px; background:var(--cpc-card); border-bottom:1px solid var(--cpc-line); gap:14px; border-radius:0; }
.cpc-dialog .cpc-dialog-heading { display:flex; align-items:center; gap:12px; flex:1; min-width:0; }
.cpc-dialog .cpc-dialog-icon { display:flex; align-items:center; justify-content:center; flex:0 0 40px; width:40px; height:40px; border-radius:50%; background:#fff1e7; color:#d97732; font-size:18px; }
.cpc-dialog .cpc-dialog-heading p { color:var(--cpc-muted); font-size:12px; line-height:1.6; margin:4px 0 0; }
.cpc-dialog .modal-card-body { padding:20px; overflow-y:auto; background:var(--cpc-card); }
.cpc-dialog .cpc-modal-fields { display:grid; grid-template-columns:1fr 1fr; align-items:start; margin:0; gap:16px; }
.cpc-dialog .cpc-modal-fields label:first-child { grid-column:1/-1; }
.cpc-dialog .cpc-modal-fields input[type=text],.cpc-dialog .cpc-modal-fields #cpc-sales-code,.cpc-dialog .cpc-modal-fields select { width:100%; }
.cpc-dialog.h-modal .modal-content .modal-card .modal-card-foot { justify-content:flex-end; padding:14px 20px; border-top:1px solid var(--cpc-line); background:var(--cpc-soft); border-radius:0; }
.cpc-dialog .modal-card-foot .cpc-button { min-width:92px; margin:0; }
.cpc-dialog .cpc-dialog-error { margin:0 0 14px; color:#b42318; background:#fff2ef; border-radius:7px; padding:10px; font-size:12px; line-height:1.6; }
.cpc-dialog #cpc-sales-delete-name { font-weight:800; font-size:16px; color:var(--cpc-ink); word-break:break-word; }
@media(max-width:480px) {
 .cpc-page .cpc-directory-toolbar { gap:10px; }
 .cpc-page .cpc-directory-toolbar .cpc-search { min-width:0; }
 .cpc-page .cpc-directory-toolbar .cpc-inline-control { gap:5px; }
 .cpc-page .cpc-directory-toolbar .cpc-inline-control select { min-width:0; width:104px; }
 .cpc-dialog .cpc-modal-fields { grid-template-columns:1fr; }
}
