/* CRM da Curva: estilos do módulo Contatos (contatos, ficha, listas, tags, campos, segmentos, importação).
   Carregado por index.php depois de app.css; usa as variáveis de cor de lá (claro e escuro). */

/* ---------------------------------------------------------------- lista de contatos */
.contacts-filters { align-items: center; }
.contacts-filters .search { flex: 1 1 240px; max-width: 420px; }
.contacts-filters select.input { max-width: 220px; }
.contacts-count { font-size: 13px; color: var(--muted); white-space: nowrap; }
.contacts-table th.sel, .contacts-table td.sel { width: 34px; padding-right: 0; }
.contacts-table td.sel input, .contacts-table th.sel input { display: block; }
.contacts-table th.sortable .icon { display: inline-block; vertical-align: -3px; margin-left: 3px; opacity: .7; }
.contacts-table td.email a { color: var(--text); font-weight: 600; text-decoration: none; }
.contacts-table td.email a:hover { color: var(--link); }
.contacts-table td .chips { gap: 4px; max-width: 360px; }
.contacts-table td .chips .tag-chip { font-size: 12px; padding: 1px 7px 1px 6px; }
.contacts-table tbody tr { cursor: pointer; }
.contacts-table td.lists-cell { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--text-2); }
.contacts-table td.date-cell { white-space: nowrap; color: var(--text-2); font-size: 12.5px; }
.contacts-table .more-chip { font-size: 11.5px; color: var(--muted); }
.select-all-note { display: flex; gap: 10px; align-items: center; padding: 8px 12px; font-size: 13px; background: var(--accent-tint); color: var(--accent-text); border-bottom: 1px solid var(--separator); }
.select-all-note .link-btn { padding: 2px 6px; }
.adv-panel { background: var(--surface); border-radius: var(--radius-l); box-shadow: var(--shadow-sm); padding: 14px 16px; margin-bottom: 12px; }
.adv-panel-foot { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.adv-panel-foot .adv-count { font-weight: 650; }
.pager .btn { height: 28px; padding: 0 8px; }
.pager .pg-info { padding: 0 8px; font-variant-numeric: tabular-nums; }
.bulk-bar .sep { width: 1px; height: 20px; background: rgba(255, 255, 255, .18); margin: 0 4px; }
@media (max-width: 640px) {
  .contacts-table .hide-xs-col { display: none; }
  .bulk-bar { bottom: 70px; gap: 0; }
  .bulk-bar .btn span { display: none; }
  .bulk-bar .btn { padding: 0 9px; }
}

/* ---------------------------------------------------------------- editor de segmento */
.seg-editor { display: flex; flex-direction: column; gap: 8px; }
.seg-top { display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--text-2); flex-wrap: wrap; }
.seg-group { border: 1px solid var(--separator); border-radius: var(--radius); padding: 10px 12px; background: var(--surface-2, var(--fill)); }
.seg-group-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.seg-group-head b { font-size: 13px; }
.seg-rules { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.seg-rule { display: grid; grid-template-columns: minmax(150px, 1.1fr) minmax(130px, 1fr) minmax(140px, 1.3fr) auto; gap: 6px; align-items: center; }
.seg-rule .input { width: 100%; min-width: 0; }
.seg-rule .seg-value { display: flex; align-items: center; min-width: 0; }
.seg-rule .seg-value > * { flex: 1; min-width: 0; }
.seg-rule .seg-value .datefield { display: inline-flex; width: 100%; }
.seg-rule .seg-value .row-center { gap: 6px; }
.seg-rule .seg-num { max-width: 120px; }
.seg-editor.compact .seg-rule { grid-template-columns: 1fr; gap: 4px; }
.seg-editor.compact .seg-group { padding: 8px; }
.seg-join { font-size: 12px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; padding-left: 4px; }
.seg-foot { display: flex; gap: 8px; }
@media (max-width: 760px) { .seg-rule { grid-template-columns: 1fr 1fr; } .seg-rule .seg-value { grid-column: 1 / 2; } .seg-rule .seg-x { grid-column: 2 / 3; justify-self: end; } }

/* ---------------------------------------------------------------- ficha do contato */
.contact-page { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1000px) { .contact-page { grid-template-columns: 1fr; } }
.contact-head { display: flex; align-items: flex-start; gap: 14px; }
.contact-avatar { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-tint); color: var(--accent-text); font-weight: 700; font-size: 19px; flex: none; }
.contact-head h2 { margin: 0 0 2px; font-size: 18px; word-break: break-word; }
.contact-head .email { font-size: 13.5px; color: var(--text-2); word-break: break-all; }
.contact-meta { display: grid; grid-template-columns: max-content 1fr; gap: 6px 12px; font-size: 13px; margin-top: 12px; }
.contact-meta > b { color: var(--muted); font-weight: 600; }
.contact-meta > span { min-width: 0; word-break: break-word; }
.contact-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.panel-head { flex-wrap: nowrap; }
.panel-head h2 { margin: 0; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cf-group { font-size: 11.5px; font-weight: 650; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; margin: 10px 0 4px; }
.cf-row { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 8px; align-items: center; padding: 4px 0; }
.cf-row > label { font-size: 13px; color: var(--text-2); font-weight: 590; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cf-row .input { height: 32px; border-color: transparent; background: var(--fill-2, var(--fill)); }
.cf-row .input:hover { border-color: var(--border); }
.cf-row .input:focus { border-color: var(--accent); background: var(--field); }
.cf-row textarea.input { height: auto; min-height: 54px; }
.cf-row .checks { gap: 6px 12px; font-size: 13px; }
.cf-row .datefield { display: inline-flex; }
.cf-empty { color: var(--placeholder); font-size: 13px; }
.cl-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--separator); font-size: 13.5px; }
.cl-row:last-child { border-bottom: 0; }
.cl-row .cl-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-row .cl-sub { font-size: 12px; color: var(--muted); white-space: nowrap; }
.cl-row.off .cl-name { color: var(--muted); text-decoration: line-through; }
.contact-tags .chips { margin-bottom: 8px; }

/* linha do tempo */
.tl-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--separator); margin: -4px 0 12px; overflow-x: auto; }
.tl-tabs button { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; flex: none; border: 0; background: none; padding: 8px 10px; font: inherit; font-size: 13.5px; color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tl-tabs button:hover { color: var(--text); }
.tl-tabs button.on { color: var(--text); font-weight: 650; border-bottom-color: var(--accent); }
.note-box { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.note-box textarea.input { min-height: 64px; }
.note-box .row-gap { justify-content: flex-end; }
.timeline { display: flex; flex-direction: column; }
.tl-item { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--separator); }
.tl-item:last-child { border-bottom: 0; }
.tl-icon { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--fill); color: var(--text-2); }
.tl-icon.green { background: var(--green-tint); color: var(--green); }
.tl-icon.red { background: var(--red-tint); color: var(--red); }
.tl-icon.blue { background: var(--link-tint); color: var(--link); }
.tl-icon.orange { background: var(--accent-tint); color: var(--accent-text); }
.tl-body { min-width: 0; font-size: 13.5px; }
.tl-body .tl-text { word-break: break-word; }
.tl-body .tl-note { white-space: pre-wrap; background: var(--fill); border-radius: var(--radius-s); padding: 8px 10px; margin-top: 4px; }
.tl-meta { font-size: 12px; color: var(--muted); margin-top: 2px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tl-meta .icon-btn { width: 22px; height: 22px; }
.tl-more { display: flex; justify-content: center; padding: 10px 0 0; }
.sends-table td.subject { font-weight: 600; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.auto-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--separator); font-size: 13.5px; }
.auto-row:last-child { border-bottom: 0; }
.auto-row .grow { min-width: 0; }
.auto-row .auto-sub { font-size: 12px; color: var(--muted); }

/* ---------------------------------------------------------------- listas, tags, campos, segmentos */
.simple-table td.name a { color: var(--text); font-weight: 600; text-decoration: none; }
.simple-table td.name a:hover { color: var(--link); }
.simple-table td.desc { color: var(--text-2); font-size: 12.5px; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.simple-table td.actions .icon-btn { width: 28px; height: 28px; }
.color-row { display: flex; align-items: center; gap: 8px; }
.color-row .color { width: 36px; height: 32px; }
.color-swatches { display: flex; gap: 6px; flex-wrap: wrap; }
.color-swatches button { width: 22px; height: 22px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; padding: 0; }
.color-swatches button.on { border-color: var(--text); }
.perstag { display: inline-flex; align-items: center; gap: 4px; }
.perstag code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; background: var(--fill-2, var(--fill)); padding: 2px 6px; border-radius: 5px; }
.perstag .icon-btn { width: 24px; height: 24px; }
.opts-list { font-size: 12.5px; color: var(--text-2); max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.seg-summary { font-size: 12.5px; color: var(--text-2); max-width: 420px; }
.seg-summary .r { display: inline-block; background: var(--fill); border-radius: 5px; padding: 1px 6px; margin: 2px 4px 2px 0; }
.counting { color: var(--muted); font-size: 12.5px; }

/* ---------------------------------------------------------------- importar e exportar */
.drop-zone { border: 2px dashed var(--border); border-radius: var(--radius-l); padding: 34px 20px; text-align: center; color: var(--text-2); cursor: pointer; transition: border-color .12s, background .12s; }
.drop-zone:hover, .drop-zone.over { border-color: var(--accent); background: var(--accent-tint); color: var(--accent-text); }
.drop-zone .icon { margin: 0 auto 8px; }
.drop-zone b { display: block; font-size: 15px; color: var(--text); }
.drop-zone input[type=file] { display: none; }
.imp-file-info { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13.5px; margin-bottom: 12px; }
.imp-file-info b { word-break: break-all; }
.map-table td.col-name { font-weight: 600; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-table td.col-sample { color: var(--text-2); font-size: 12.5px; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.map-table td.col-dest select.input { min-width: 200px; max-width: 320px; height: 32px; font-size: 13px; }
.map-table td.col-dest .input.new-name { margin-top: 4px; height: 30px; font-size: 13px; }
.map-table tr.skipped td { color: var(--muted); }
.imp-options { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
@media (max-width: 760px) { .imp-options { grid-template-columns: 1fr; } }
.imp-options .checks { flex-direction: column; align-items: flex-start; gap: 6px; }
.imp-options .check { white-space: normal; align-items: flex-start; }
.imp-options .check input { margin-top: 2px; }
.imp-summary { font-size: 13px; color: var(--text-2); margin-top: 10px; }
.progress { height: 10px; border-radius: 5px; background: var(--fill); overflow: hidden; margin: 8px 0; }
.progress > i { display: block; height: 100%; background: var(--accent); border-radius: 5px; transition: width .3s; }
.progress.done > i { background: var(--green); }
.progress.failed > i { background: var(--red); }
.job-stats { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; color: var(--text-2); }
.job-stats b { color: var(--text); font-variant-numeric: tabular-nums; }
.job-log { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; background: var(--fill); border-radius: var(--radius-s); padding: 10px 12px; max-height: 220px; overflow: auto; white-space: pre-wrap; word-break: break-word; margin-top: 10px; }
.jobs-table td.job-type { font-weight: 600; white-space: nowrap; }
.jobs-table td.job-res { font-size: 12.5px; color: var(--text-2); }
.export-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-bottom: 12px; }