/* Customer workspace only: keep the existing navigation and other tools unchanged. */
main:has(> .customer-data) > .page-header { display: none; }
.customer-data { --cd-blue: #2467dd; --cd-ink: #203655; --cd-muted: #697e98; --cd-line: #e1e9f3; display: grid; gap: 22px; color: var(--cd-ink); padding: 8px 0 24px; font-size: 14px; }
.customer-data *, .customer-data *::before, .customer-data *::after { box-sizing: border-box; }
.customer-data h1, .customer-data h2, .customer-data h3, .customer-data p { margin: 0; }
.customer-data button, .customer-data input, .customer-data select, .customer-data textarea { font: inherit; }
.customer-data button { cursor: pointer; }
.customer-data button:disabled { cursor: not-allowed; opacity: .5; }
.customer-data input, .customer-data select, .customer-data textarea { width: 100%; min-width: 0; border: 1px solid #d5e0ee; border-radius: 9px; background: #fff; color: #263e5f; padding: 10px 12px; line-height: 1.5; box-shadow: none; }
.customer-data input:focus, .customer-data select:focus, .customer-data textarea:focus { outline: 3px solid #2467dd15; border-color: #71a1ef; }
.customer-data input:disabled { background: #f4f6f9; }
.customer-data input::placeholder, .customer-data textarea::placeholder { color: #8494aa; }
.customer-data label { display: flex; flex-direction: column; gap: 7px; color: #506783; font-size: 13px; font-weight: 600; }
.customer-data label small { font-size: 12px; font-weight: 400; color: var(--cd-muted); }
.customer-data .cd-eyebrow { display: block; color: #4478bd; font-size: 10px; font-weight: 700; letter-spacing: 2px; line-height: 1.5; }
.customer-data .cd-hero { display: flex; justify-content: space-between; align-items: center; gap: 24px; min-height: 186px; padding: 29px 32px; border: 1px solid #dce9f7; border-radius: 20px; background: radial-gradient(ellipse at 85% 0, #dfecffb8, transparent 45%), linear-gradient(120deg, #f2f8ff, #fafcff 55%, #f0f3ff); box-shadow: 0 8px 30px #406cb608; }
.customer-data .cd-hero h1 { margin: 10px 0 10px; color: #173458; font-size: 30px; font-weight: 750; letter-spacing: -.7px; }
.customer-data .cd-hero p { color: #607894; font-size: 14px; line-height: 1.7; }
.customer-data .cd-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.customer-data .cd-hero-pills { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 17px; color: #6983a1; font-size: 11px; }
.customer-data .cd-hero-pills span::before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 6px; border-radius: 50%; background: #6aa5df; vertical-align: 1px; }
.customer-data .cd-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex-shrink: 0; min-height: 38px; padding: 9px 16px; border: 1px solid #d6e1ee; border-radius: 9px; background: #fff; color: #486484; font-size: 13px; font-weight: 600; line-height: 1.4; white-space: nowrap; box-shadow: 0 2px 3px #14386503; }
.customer-data .cd-btn:hover:not(:disabled) { border-color: #97b6e2; background: #f6faff; transform: translateY(-1px); }
.customer-data .cd-btn-primary { border-color: #2869de; background: linear-gradient(110deg, #2879e9, #3765db); color: #fff; box-shadow: 0 6px 14px #2b6dde22; }
.customer-data .cd-btn-primary:hover:not(:disabled) { color: #fff; background: #245ecc; border-color: #245ecc; }
.customer-data .cd-hero-actions .cd-btn { min-height: 43px; padding: 12px 20px; }
.customer-data .cd-stats { display: grid; grid-template-columns: 1fr 1fr 1.35fr; gap: 16px; }
.customer-data .cd-stats article { display: flex; align-items: flex-start; gap: 17px; padding: 23px; border: 1px solid var(--cd-line); border-radius: 15px; background: #fff; box-shadow: 0 3px 13px #21427103; }
.customer-data .cd-stat-icon { display: grid; place-items: center; width: 43px; height: 43px; flex-shrink: 0; border: 1px solid #dceaff; border-radius: 12px; background: #edf5ff; color: #4a8be1; font-size: 23px; }
.customer-data .cd-stat-purple { color: #8a72c9; background: #f3effc; border-color: #e9e1fa; }
.customer-data .cd-stat-green { color: #499b9a; background: #ecf8f7; border-color: #d8efec; }
.customer-data .cd-stats p { font-size: 12px; color: #72869e; }
.customer-data .cd-stats strong { display: block; font-size: 28px; line-height: 1.6; letter-spacing: -.7px; color: #20395e; }
.customer-data .cd-stats .cd-stat-date { font-size: 17px; line-height: 2.6; letter-spacing: 0; }
.customer-data .cd-stats small { display: block; font-size: 11px; color: #7c8ea4; }
.customer-data .cd-panel { min-width: 0; overflow: hidden; border: 1px solid var(--cd-line); border-radius: 17px; background: #fff; box-shadow: 0 4px 19px #30588904; }
.customer-data .cd-panel-tabs { display: flex; justify-content: space-between; align-items: center; padding: 0 24px; border-bottom: 1px solid #e8edf4; }
.customer-data .cd-panel-tabs [role='tablist'] { display: flex; gap: 28px; }
.customer-data .cd-panel-tabs [role='tab'] { min-height: 60px; padding: 18px 0; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: transparent; color: #6a7e98; font-size: 14px; font-weight: 600; }
.customer-data .cd-panel-tabs [role='tab'].is-active { color: #2767cf; border-bottom-color: #4383eb; }
.customer-data .cd-text-button { padding: 5px 2px; border: 0; background: transparent; color: #2b73d5; font-size: 12px; font-weight: 600; white-space: nowrap; }
.customer-data .cd-text-button:hover:not(:disabled) { color: #194e99; text-decoration: underline; }
.customer-data .cd-filters { display: grid; gap: 16px; padding: 22px 24px; border-bottom: 1px solid #e9eff6; background: linear-gradient(180deg, #fff, #fbfcfe); }
.customer-data .cd-search input { max-width: none; background: #f8fafc; padding: 12px 15px; }
.customer-data .cd-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.customer-data .cd-field-filter { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(220px, 2fr) auto auto; gap: 12px; align-items: end; }
.customer-data .cd-field-filter > .cd-btn { min-height: 42px; }
.customer-data .cd-table-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 18px 24px; }
.customer-data .cd-table-toolbar > div { display: flex; align-items: center; gap: 10px; }
.customer-data .cd-table-toolbar strong { font-size: 13px; }
.customer-data .cd-filter-tag { border-radius: 5px; padding: 4px 7px; color: #618bc5; background: #f0f5fd; font-size: 11px; }
.customer-data .cd-export-ready { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 0 24px 18px; padding: 14px 16px; border: 1px solid #cfe4f9; border-radius: 9px; background: #f4f9ff; }
.customer-data .cd-export-ready strong, .customer-data .cd-export-ready span { display: block; }
.customer-data .cd-export-ready strong { color: #3d6793; font-size: 12px; }
.customer-data .cd-export-ready span { margin-top: 5px; color: #7a92ac; font-size: 11px; line-height: 1.7; }
.customer-data .cd-export-save { display: inline-flex; justify-content: center; align-items: center; flex-shrink: 0; min-height: 36px; padding: 8px 13px; border: 1px solid #a9c9f1; border-radius: 8px; background: #fff; color: #286bc8; font-size: 12px; font-weight: 600; text-decoration: none; }
.customer-data .cd-export-save:hover { border-color: #6c9ede; background: #eaf3ff; }
.customer-data .cd-export-save:focus-visible { outline: 3px solid #2467dd30; outline-offset: 3px; }
.customer-data .cd-table-scroll { width: 100%; overflow: auto; scrollbar-width: thin; scrollbar-color: #ccd9e9 #f7f9fc; }
.customer-data table { width: 100%; border-collapse: collapse; font-size: 12px; text-align: left; }
.customer-data th { height: 44px; padding: 11px 17px; border-top: 1px solid #e8eef6; border-bottom: 1px solid #e8eef6; background: #f6f9fd; color: #5a7392; font-size: 12px; font-weight: 600; white-space: nowrap; }
.customer-data td { max-width: 260px; min-width: 112px; padding: 15px 17px; border-bottom: 1px solid #edf1f7; color: #364f6f; font-size: 12px; line-height: 1.6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.customer-data tbody tr:hover td { background: #f8fbff; }
.customer-data td strong { font-size: 12px; font-weight: 600; }
.customer-data .cd-sticky-cell { position: sticky; right: 0; min-width: 88px; border-left: 1px solid #e9eff6; background: #fff; }
.customer-data th.cd-sticky-cell { background: #f6f9fd; }
.customer-data .cd-muted { color: #a0afc0; }
.customer-data .cd-status { display: inline-block; padding: 3px 7px; border: 1px solid #dceee6; border-radius: 5px; background: #f0f8f4; color: #44846b; font-size: 10px; }
.customer-data .cd-status-warning { border-color: #f3e5c7; background: #fff9ed; color: #ad8540; }
.customer-data .cd-pagination { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 18px 24px; color: #8190a4; font-size: 11px; }
.customer-data .cd-pagination > div { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.customer-data .cd-pagination label { display: flex; flex-direction: row; align-items: center; font-size: 11px; white-space: nowrap; }
.customer-data .cd-pagination select { min-width: 72px; padding: 6px 8px; font-size: 11px; }
.customer-data .cd-pagination .cd-btn { min-height: 31px; padding: 7px 11px; font-size: 11px; }
.customer-data .cd-empty { display: grid; justify-items: center; align-content: center; gap: 13px; min-height: 240px; padding: 36px; text-align: center; white-space: normal; }
.customer-data .cd-empty h3 { color: #526d8d; font-size: 16px; font-weight: 600; }
.customer-data .cd-empty p { color: #8798ac; font-size: 12px; }
.customer-data .cd-empty-symbol { font-size: 38px; color: #adc7eb; }
.customer-data .cd-footnote { color: #8495aa; font-size: 11px; line-height: 1.8; }
.customer-data .cd-message { padding: 12px 15px; border: 1px solid #d6e8f9; border-radius: 9px; background: #f1f7fe; color: #486a91; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.customer-data .cd-message p + p { margin-top: 6px; }
.customer-data .cd-error { border-color: #f0d6d1; background: #fff5f2; color: #a34c3d; }
.customer-data .cd-success { display: flex; justify-content: space-between; gap: 12px; border-color: #cfe8dc; background: #f0faf5; color: #387657; }
.customer-data .cd-success button { border: 0; background: none; color: inherit; }
.customer-data .cd-warning { border-color: #efe3c7; background: #fffaf0; color: #9b7a36; }
.customer-data .cd-progress { display: flex; gap: 10px; align-items: center; }
.customer-data .cd-panel > .cd-message { margin: 0 24px 18px; }
.customer-data .cd-spinner { display: inline-block; width: 17px; height: 17px; flex-shrink: 0; border: 2px solid #d5e5fa; border-top-color: #4383dc; border-radius: 50%; animation: cd-spin 1s linear infinite; }
@keyframes cd-spin { to { transform: rotate(360deg); } }
.customer-data .cd-overlay { position: fixed; inset: 0; z-index: 1300; display: grid; place-items: center; padding: 28px; background: #15305365; backdrop-filter: blur(4px); overflow: auto; }
.customer-data .cd-modal { display: flex; flex-direction: column; width: min(680px, 100%); max-height: calc(100dvh - 56px); overflow: auto; border: 1px solid #e1e9f4; border-radius: 18px; background: #fff; color: var(--cd-ink); box-shadow: 0 24px 100px #15345d35; outline: 0; }
.customer-data .cd-modal-wide { width: min(1040px, 100%); }
.customer-data .cd-modal-head { display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; padding: 23px 27px; border-bottom: 1px solid #e7edf5; background: linear-gradient(120deg, #f7fbff, #fff); }
.customer-data .cd-modal-head h2 { margin-top: 7px; color: #284464; font-size: 21px; }
.customer-data .cd-close { width: 31px; height: 31px; padding: 0; border: 1px solid #dce5f0; border-radius: 8px; background: #fff; color: #7589a1; font-size: 22px; }
.customer-data .cd-modal-body { display: grid; gap: 18px; padding: 24px 27px; }
.customer-data .cd-modal-footer { display: flex; justify-content: flex-end; gap: 10px; flex-shrink: 0; padding: 17px 27px; border-top: 1px solid #e8eef5; background: #fbfcfe; }
.customer-data .cd-steps { display: flex; gap: 30px; list-style: none; padding: 0; margin: 0 0 6px; }
.customer-data .cd-steps li { display: flex; gap: 9px; align-items: center; color: #93a2b5; font-size: 12px; }
.customer-data .cd-steps li span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #edf1f6; font-size: 11px; }
.customer-data .cd-steps li.is-current { color: #3676d6; }
.customer-data .cd-steps li.is-current span { background: #e8f1ff; color: #3d7bd8; }
.customer-data .cd-upload-zone { display: grid; justify-items: center; gap: 16px; padding: 43px 30px; border: 1px dashed #adc7e8; border-radius: 13px; background: #f9fbff; text-align: center; }
.customer-data .cd-upload-zone h3 { font-size: 18px; color: #395b83; }
.customer-data .cd-upload-zone p { max-width: 560px; color: #7d90a9; line-height: 1.7; font-size: 12px; }
.customer-data .cd-upload-symbol { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 17px; background: #eaf3ff; color: #4e8fde; font-size: 36px; }
.customer-data .cd-fineprint { font-size: 12px; line-height: 1.8; color: #7e90a6; }
.customer-data .cd-file-card { display: flex; align-items: center; gap: 15px; padding: 16px; border: 1px solid #dce7f4; border-radius: 11px; background: #f6faff; }
.customer-data .cd-file-card > span { display: grid; place-items: center; width: 38px; height: 42px; flex-shrink: 0; border-radius: 8px; background: #e2eeff; color: #5c8fce; font-size: 25px; }
.customer-data .cd-file-card > div { min-width: 0; flex: 1; }
.customer-data .cd-file-card strong { display: block; color: #385b86; font-size: 13px; overflow-wrap: anywhere; }
.customer-data .cd-file-card small { display: block; margin-top: 6px; font-size: 11px; color: #7f97b1; }
.customer-data .cd-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.customer-data .cd-span-2 { grid-column: 1 / -1; }
.customer-data .cd-section-title { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.customer-data .cd-section-title h3 { font-size: 15px; color: #3c587b; }
.customer-data .cd-section-title > span { color: #8597ad; font-size: 11px; }
.customer-data .cd-mapping-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; max-height: 350px; padding: 2px; overflow: auto; }
.customer-data .cd-mapping-grid label { display: grid; grid-template-columns: minmax(80px, 1fr) minmax(130px, 1fr); align-items: center; gap: 9px; padding: 10px 11px; border: 1px solid #e5ebf3; border-radius: 8px; background: #fbfcfe; }
.customer-data .cd-mapping-grid label > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.customer-data .cd-mapping-grid select { padding: 7px 9px; font-size: 12px; }
.customer-data .cd-preview-table { max-height: 280px; border: 1px solid #e2eaf4; border-radius: 9px; }
.customer-data .cd-preview-table th { border-top: 0; }
.customer-data .cd-preview-table td { min-width: 100px; max-width: 220px; padding: 10px 14px; }
.customer-data .cd-import-counts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.customer-data .cd-import-counts > div { padding: 17px; border: 1px solid #e1eaf5; border-radius: 10px; background: #f9fbff; }
.customer-data .cd-import-counts span { display: block; color: #7087a3; font-size: 11px; }
.customer-data .cd-import-counts strong { display: block; margin-top: 9px; color: #375e8d; font-size: 24px; }
.customer-data .cd-extra-row { display: grid; grid-template-columns: 1fr 1.6fr auto; gap: 10px; }
.customer-data .cd-column-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.customer-data .cd-column-list label { display: flex; flex-direction: row; align-items: center; gap: 10px; padding: 10px; border: 1px solid #e6edf6; border-radius: 8px; }
.customer-data .cd-column-list input { width: 16px; height: 16px; flex-shrink: 0; accent-color: #347cdd; }
.customer-data .cd-column-list span { min-width: 0; overflow-wrap: anywhere; }
.customer-data .cd-column-list small { display: block; margin-top: 4px; }
.customer-data .cd-history-note { padding: 20px 24px; color: #7b8ea7; font-size: 12px; line-height: 1.8; }
.customer-data .cd-cell-subtitle { display: block; max-width: 250px; color: #8e9db1; font-size: 10px; overflow: hidden; text-overflow: ellipsis; }
.customer-data .cd-detail-top { padding: 18px; border: 1px solid #e1eaf4; border-radius: 10px; background: #f7faff; }
.customer-data .cd-detail-top h3 { margin-bottom: 10px; color: #355782; font-size: 20px; overflow-wrap: anywhere; }
.customer-data .cd-detail-top p { margin-top: 9px; color: #8698ae; font-size: 11px; }
.customer-data .cd-detail-heading { color: #47688e; font-size: 15px; }
.customer-data .cd-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 0; border-top: 1px solid #e8eef5; }
.customer-data .cd-detail-grid > div { min-width: 0; padding: 15px 12px; border-bottom: 1px solid #e8eef5; }
.customer-data .cd-detail-grid dt { margin-bottom: 7px; color: #8698af; font-size: 11px; }
.customer-data .cd-detail-grid dd { margin: 0; color: #405e80; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; white-space: pre-wrap; }
@media (max-width: 1250px) {
  .customer-data .cd-hero { padding: 25px; }
  .customer-data .cd-hero-actions { flex-direction: column; }
  .customer-data .cd-stats article { padding: 18px 15px; gap: 12px; }
  .customer-data .cd-pagination { align-items: flex-start; flex-direction: column; }
  .customer-data .cd-stats .cd-stat-date { font-size: 14px; }
}
@media (max-width: 750px) {
  .customer-data .cd-hero { align-items: flex-start; flex-direction: column; }
  .customer-data .cd-hero-actions { flex-direction: row; }
  .customer-data .cd-stats, .customer-data .cd-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-data .cd-stats article:last-child { grid-column: 1 / -1; }
  .customer-data .cd-field-filter { grid-template-columns: 1fr 1fr; }
  .customer-data .cd-overlay { padding: 12px; }
  .customer-data .cd-modal { max-height: calc(100dvh - 24px); }
  .customer-data .cd-modal-head, .customer-data .cd-modal-body, .customer-data .cd-modal-footer { padding: 18px; }
  .customer-data .cd-mapping-grid, .customer-data .cd-detail-grid { grid-template-columns: 1fr; }
  .customer-data .cd-import-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-data .cd-modal-footer { flex-wrap: wrap; }
  .customer-data .cd-table-toolbar { align-items: flex-start; flex-direction: column; }
  .customer-data .cd-export-ready { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { .customer-data *, .customer-data *::before, .customer-data *::after { animation: none !important; transition: none !important; } }
.customer-data .cd-select-cell { width: 44px; min-width: 44px; text-align: center; }
.customer-data .cd-select-cell input, .customer-data .cd-confirm-check input { width: 17px; height: 17px; accent-color: #2867dc; cursor: pointer; }
.customer-data .cd-confirm-check { display: flex; align-items: center; gap: 10px; padding: 16px; background: #f5f8ff; border-radius: 12px; }
.customer-data .cd-btn-danger { color: #a52736; background: #fff3f3; border-color: #f2c6ca; }
.customer-data .cd-danger-text { color: #ac3541; margin-left: 10px; }
.customer-data .cd-text-button:disabled { color: #9aa6b8; cursor: not-allowed; }
.customer-data .cd-mutation-count { font-size: 20px; color: #273d61; }
.customer-data .cd-table-toolbar { flex-wrap: wrap; gap: 12px; }
