/* certificates/certificates.css
 *
 * Scoped under .cdx-certs-* (cdx- prefix, no global leak).
 * Colors only from CSS custom properties (tokens.css palette).
 * Every surface/text/border token has a [data-theme="dark"] override. */

/* ── Tab accent ───────────────────────────────────────────────── */
.cdx-tab--certificates { --accent-color: var(--codex-certificates, #8b5cf6); }

/* ── Shell layout ─────────────────────────────────────────────── */
.cdx-certs-shell {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
}

/* ── Modelos: sidebar + editor ────────────────────────────────── */
.cdx-certs-modelos {
  display: flex;
  gap: 0;
  height: calc(100vh - 120px);
  min-height: 0;
}

.cdx-certs-sidebar {
  width: 260px;
  min-width: 200px;
  flex-shrink: 0;
  border-right: 1px solid var(--border);
  background: var(--surface);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

[data-theme="dark"] .cdx-certs-sidebar {
  background: var(--surface);
  border-right-color: var(--border);
}

.cdx-certs-sidebar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border);
  gap: 0.5rem;
}

.cdx-certs-sidebar-title {
  font-weight: 700;
  font-size: 0.88rem;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

[data-theme="dark"] .cdx-certs-sidebar-title { color: var(--text-secondary); }

#cdx-certs-tpl-list {
  flex: 1;
  overflow-y: auto;
  padding: 0.4rem 0;
}

.cdx-certs-tpl-row {
  display: flex;
  align-items: center;
  padding: 0.55rem 1rem;
  cursor: pointer;
  border-left: 3px solid transparent;
  gap: 0.5rem;
}

.cdx-certs-tpl-row:hover { background: var(--surface-hover, rgba(13, 148, 136,0.10)); }
.cdx-certs-tpl-row.is-active {
  background: var(--cdx-card-sel-bg, rgba(99,102,241,0.12));
  border-left-color: var(--accent-color, #8b5cf6);
}

[data-theme="dark"] .cdx-certs-tpl-row.is-active { background: var(--cdx-card-sel-bg); }

.cdx-certs-tpl-row-info { flex: 1; min-width: 0; }
.cdx-certs-tpl-row-title {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cdx-certs-tpl-row-sub {
  font-size: 0.75rem;
  color: var(--text-secondary);
  margin-top: 1px;
}
.cdx-certs-tpl-del {
  background: none;
  border: none;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 2px 5px;
  font-size: 1rem;
  border-radius: 4px;
  opacity: 0;
  transition: opacity 0.12s;
}
.cdx-certs-tpl-row:hover .cdx-certs-tpl-del { opacity: 1; }
.cdx-certs-tpl-del:hover { color: var(--error, #e74c3c); background: rgba(231,76,60,0.1); }

/* ── Editor region ─────────────────────────────────────────────── */
.cdx-certs-editor-region {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--surface-alt, var(--surface));
}

[data-theme="dark"] .cdx-certs-editor-region { background: var(--surface-alt, var(--surface)); }

.cdx-certs-palette-wrap {
  padding: 0.65rem 1.25rem 0.5rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

[data-theme="dark"] .cdx-certs-palette-wrap { background: var(--surface); }

.cdx-certs-palette-title {
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-secondary);
  margin-bottom: 0.25rem;
}

.cdx-certs-palette-hint {
  font-size: 0.77rem;
  color: var(--text-secondary);
  margin: 0 0 0.4rem;
}

.cdx-certs-palette-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.cdx-cert-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.22rem 0.6rem;
  border-radius: 5px;
  border: 1px solid var(--border);
  background: var(--surface-hover, rgba(13, 148, 136,0.08));
  cursor: pointer;
  font-size: 0.78rem;
  color: var(--text-primary);
  transition: background 0.1s, border-color 0.1s;
}

.cdx-cert-chip:hover {
  background: var(--cdx-card-sel-bg, rgba(99,102,241,0.12));
  border-color: var(--accent-color, #8b5cf6);
}

.cdx-cert-chip code {
  font-family: monospace;
  font-size: 0.8em;
  color: var(--codex-certificates, #8b5cf6);
  background: none;
}

[data-theme="dark"] .cdx-cert-chip code { color: var(--codex-certificates, #a78bfa); }

.cdx-cert-chip-label {
  color: var(--text-secondary);
  font-size: 0.75em;
}

.cdx-certs-editor-mount {
  flex: 1;
  min-height: 0;
  overflow: auto;
  background: var(--surface);
}

[data-theme="dark"] .cdx-certs-editor-mount { background: var(--surface); }

/* ── Emitidos ──────────────────────────────────────────────────── */
.cdx-certs-emitidos {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 1rem 1.5rem;
  min-height: 0;
}

.cdx-certs-toolbar {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

/* Quiet utility glyph: download the local ICP-Brasil signer app. Not a primary
   action (one-time install), so it reads as a muted icon next to Emitir; the
   tooltip explains it. */
.cdx-certs-signer-dl {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: none;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text-secondary);
  text-decoration: none;
  transition: color 0.12s ease, border-color 0.12s ease, background 0.12s ease;
}
.cdx-certs-signer-dl:hover {
  color: var(--accent-color);
  border-color: var(--accent-color);
  background: var(--surface-hover);
}

.cdx-certs-search {
  padding: 0.4rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text-primary);
  font-size: 0.875rem;
  min-width: 200px;
  flex: 1;
  max-width: 320px;
  outline: none;
}
.cdx-certs-search:focus { border-color: var(--accent-color, #8b5cf6); box-shadow: 0 0 0 2px rgba(139,92,246,0.18); }

[data-theme="dark"] .cdx-certs-search {
  background: var(--surface);
  border-color: var(--border);
  color: var(--text-primary);
}

.cdx-certs-select {
  padding: 0.4rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text-primary);
  font-size: 0.875rem;
}

[data-theme="dark"] .cdx-certs-select {
  background: var(--surface);
  border-color: var(--border);
  color: var(--text-primary);
}

/* Date-range filter: a small inline label + a native date input matching the
 * select chrome. */
.cdx-certs-datelabel {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-secondary);
  white-space: nowrap;
}
.cdx-certs-date {
  padding: 0.36rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
  color: var(--text-primary);
  font: inherit;
  font-size: 0.82rem;
  outline: none;
}
.cdx-certs-date:focus { border-color: var(--primary); }

/* Disabled cohort filter (locked until a client is chosen) reads as inert. */
.cdx-certs-select:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ── Certificate table ─────────────────────────────────────────── */
.cdx-certs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.cdx-certs-table th,
.cdx-certs-table td {
  padding: 0.55rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
  color: var(--text-primary);
}

.cdx-certs-table th {
  font-weight: 600;
  color: var(--text-secondary);
  background: var(--surface);
  border-bottom: 2px solid var(--border);
}

[data-theme="dark"] .cdx-certs-table th {
  background: var(--surface);
  color: var(--text-secondary);
  border-bottom-color: var(--border);
}

.cdx-certs-table tr:hover td { background: var(--surface-hover, rgba(13, 148, 136,0.06)); }

.cdx-certs-code code {
  font-family: monospace;
  font-size: 0.82em;
  color: var(--text-secondary);
}

.cdx-certs-actions {
  display: flex;
  gap: 0.3rem;
  flex-wrap: wrap;
}

/* Action buttons (row toolbar + bulk bar): glyph + label. On a narrow viewport the
   label collapses and only the glyph stays, so the action set fits without wrapping. */
.cdx-cert-act { display: inline-flex; align-items: center; gap: 0.32rem; }
.cdx-cert-act .cdx-cert-act-i { flex: 0 0 auto; display: block; }
.cdx-cert-act .cdx-cert-act-t { white-space: nowrap; }
@media (max-width: 1100px) {
  .cdx-cert-act .cdx-cert-act-t { display: none; }
  .cdx-cert-act { padding-left: 0.45rem; padding-right: 0.45rem; gap: 0; }
}

/* ── Status badges ─────────────────────────────────────────────── */
.cdx-cert-badge {
  display: inline-block;
  padding: 0.18rem 0.5rem;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Colors live in css/tokens.css (--cdx-cert-*), which carries the dark
   overrides; these rules just consume them, so no [data-theme] block here. */
.cdx-cert-badge--issued  { background: var(--cdx-cert-issued-bg);  color: var(--cdx-cert-issued-txt); }
.cdx-cert-badge--signed  { background: var(--cdx-cert-signed-bg);  color: var(--cdx-cert-signed-txt); }
.cdx-cert-badge--sent    { background: var(--cdx-cert-sent-bg);    color: var(--cdx-cert-sent-txt); }
.cdx-cert-badge--revoked { background: var(--cdx-cert-revoked-bg); color: var(--cdx-cert-revoked-txt); }
.cdx-cert-badge--unknown { background: rgba(107,114,128,0.12);     color: var(--text-secondary); }

/* ── Issue flow modal ──────────────────────────────────────────── */
.cdx-cert-roster {
  max-height: 200px;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.4rem 0.6rem;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

[data-theme="dark"] .cdx-cert-roster { background: var(--surface); border-color: var(--border); }

.cdx-cert-roster-row {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.875rem;
  padding: 0.3rem 0.25rem;
  border-radius: 4px;
  cursor: pointer;
}
.cdx-cert-roster-row:hover { background: var(--surface-hover, rgba(13, 148, 136,0.08)); }
.cdx-cert-roster-row input[type="checkbox"] { margin-top: 0.15rem; }
/* Person block: name + tier badge on line 1, the delivery e-mail prominent below. */
.cdx-cert-roster-person { display: flex; flex-direction: column; gap: 0.05rem; min-width: 0; }
.cdx-cert-roster-line1 { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.cdx-cert-roster-email { color: var(--text-primary); font-size: 0.82em; word-break: break-all; }
/* No e-mail = this certificate can't be delivered; flag it clearly. */
.cdx-cert-roster-noemail {
  color: var(--danger, #b91c1c);
  font-size: 0.78em;
  font-style: italic;
}
.cdx-cert-roster-row--noemail { background: var(--danger-bg, rgba(185,28,28,0.06)); }
/* "Selecionar todos" sits at the top of the roster, separated by a rule. */
.cdx-cert-roster-all { border-bottom: 1px solid var(--border); border-radius: 0; margin-bottom: 0.15rem; padding-bottom: 0.35rem; position: sticky; top: -0.4rem; background: var(--surface); }
.cdx-cert-roster-allk { font-weight: 600; }

/* Model/theme selectors (left) + live preview thumbnail (right) in the issue modal. */
.cdx-cert-issue-preview-split { display: flex; gap: 0.9rem; align-items: flex-start; margin: 0 0 0.75rem; }
.cdx-cert-issue-fields { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.cdx-cert-issue-thumbwrap { flex: 0 0 auto; width: 180px; display: flex; flex-direction: column; gap: 0.3rem; }
.cdx-cert-issue-thumb {
  display: block; width: 180px; padding: 0; border: 1px solid var(--border); border-radius: 8px;
  background: var(--background); cursor: pointer; overflow: hidden; line-height: 0;
  box-shadow: 0 2px 8px rgba(6, 26, 81, 0.07); transition: box-shadow 0.15s, border-color 0.15s;
}
.cdx-cert-issue-thumb:hover { border-color: var(--primary); box-shadow: 0 4px 14px rgba(6, 26, 81, 0.14); }
.cdx-cert-issue-thumbwrap .cdx-field-hint { margin: 0; text-align: center; }
@media (max-width: 560px) {
  .cdx-cert-issue-preview-split { flex-direction: column; }
  .cdx-cert-issue-thumbwrap, .cdx-cert-issue-thumb { width: 100%; }
}

/* Empty-field warning list (pre-issue guard). */
.cdx-cert-empty-list { margin: 0 0 1.2rem; padding-left: 1.2rem; color: var(--text-secondary); font-size: 0.86rem; }
.cdx-cert-empty-list li { margin-bottom: 0.15rem; }

.cdx-cert-issue-result {
  background: var(--surface-hover, rgba(99,102,241,0.07));
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.85rem 1rem;
  margin-bottom: 0.75rem;
  font-size: 0.875rem;
}
.cdx-cert-issue-result ul { margin: 0.4rem 0 0 1.2rem; padding: 0; }
.cdx-cert-issue-result li { margin-bottom: 0.2rem; }
.cdx-cert-issue-result code { font-family: monospace; font-size: 0.9em; }
/* Skipped (already-issued) participants — a muted note under the issued list. */
.cdx-cert-issue-skipped { margin-top: 0.6rem; padding-top: 0.6rem; border-top: 1px dashed var(--border); color: var(--text-secondary); }
.cdx-cert-issue-skipped strong { color: var(--cdx-cert-issued-ac); }

/* ── Preview modal ─────────────────────────────────────────────── */
.cdx-cert-preview-dl {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.4rem 1rem;
  font-size: 0.875rem;
  margin-bottom: 1rem;
}
.cdx-cert-preview-dl dt { font-weight: 600; color: var(--text-secondary); }
.cdx-cert-preview-dl dd { margin: 0; color: var(--text-primary); word-break: break-all; }
.cdx-cert-preview-note {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin: 0 0 1rem;
}

/* ── Modelos: master-detail catalog (shared Items/Labs split shell) ──────── */
/* No own padding: the wrap is a .cdx-labs flex column; the page margins come
   from #codex-view (.cdx-view padding), exactly like the Labs sub-tab. */
.cdx-certs-modelos-wrap { min-width: 0; }
/* Narrow list (short template names) so the landscape preview gets more room.
   align-items:start so the preview pane can grow taller than the list without
   stretching the list to match. */
.cdx-certs-modelos-split.cdx-items-split { grid-template-columns: 240px 1fr; align-items: start; }
@media (max-width: 980px) { .cdx-certs-modelos-split.cdx-items-split { grid-template-columns: 1fr; } }

/* Left column = Frente/Verso tabs stacked over the list. */
.cdx-cert-side { display: flex; flex-direction: column; gap: 0.5rem; min-width: 0; }
.cdx-cert-side-tabs {
  display: flex;
  gap: 0.25rem;
  padding: 0.25rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  flex-shrink: 0;
}
.cdx-cert-side-tab {
  flex: 1;
  padding: 0.4rem 0.6rem;
  border: 0;
  border-radius: 7px;
  background: transparent;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-secondary);
  cursor: pointer;
}
.cdx-cert-side-tab:hover { background: var(--cdx-card-hover-bg, rgba(127,127,127,0.08)); }
.cdx-cert-side-tab.is-active { background: var(--primary); color: var(--text-on-accent, #fff); }

.cdx-cert-tpl-icon { color: var(--accent-color, #8b5cf6); font-size: 1.05rem; }

/* Slim preview header: a thin bar, not the tall default. */
.cdx-cert-preview-head { padding: 0.5rem 0.8rem; align-items: center; }

/* Right pane conforms to the sheet: JS scales the single sheet to the pane WIDTH,
   the pane grows to its height. No fixed height, no clipping, no scrollbar. */
.cdx-certs-modelos-split .cdx-cert-preview { max-height: none; overflow: visible; }
.cdx-cert-preview-body {
  flex: none;
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 0.6rem;
  background: #eef2f1;
}
[data-theme="dark"] .cdx-cert-preview-body { background: #11161c; }

.cdx-cert-sheet-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 6px 22px rgba(0,0,0,0.18);
  flex-shrink: 0;
  box-sizing: border-box;
}
.cdx-cert-sheet-wrap .cdx-cert-page { position: absolute; top: 0; left: 0; }

.cdx-cert-theme-picker {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface);
}

[data-theme="dark"] .cdx-cert-theme-picker { background: var(--surface); border-color: var(--border); }

.cdx-cert-theme-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
  padding: 0 0.35rem;
}

.cdx-cert-theme-chip {
  border: 1px solid transparent;
  background: none;
  color: var(--text-secondary);
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.28rem 0.7rem;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.cdx-cert-theme-chip:hover { color: var(--text-primary); background: var(--surface-hover, rgba(13, 148, 136,0.10)); }
.cdx-cert-theme-chip.is-active {
  color: var(--text-on-accent, #fff);
  background: var(--accent-color, #8b5cf6);
  border-color: var(--accent-color, #8b5cf6);
}

/* ── Fullscreen viewer (real front + back) — mirrors CVLabViewer ─────────── */
.cdx-cert-fs-overlay {
  position: fixed;
  inset: 0;
  z-index: 9500;
  background: rgba(8, 12, 18, 0.92);
  padding: 3rem 1.5rem;
  animation: cdxCertFsIn 160ms ease-out;
}
@keyframes cdxCertFsIn { from { opacity: 0; } to { opacity: 1; } }

.cdx-cert-fs-body {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  overflow: hidden;
}

.cdx-cert-fs-actions {
  position: fixed;
  top: 0.75rem;
  right: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  z-index: 2;
}
.cdx-cert-fs-close,
.cdx-cert-fs-btn {
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.6);
  color: var(--text-on-accent, #fff);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 160ms, transform 120ms;
}
.cdx-cert-fs-close { width: 40px; font-size: 22px; line-height: 1; }
.cdx-cert-fs-btn { padding: 0 1rem; font-size: 0.85rem; font-weight: 600; }
.cdx-cert-fs-close:hover,
.cdx-cert-fs-btn:hover { background: rgba(0, 0, 0, 0.88); transform: scale(1.05); }

/* ── Issue modal: field rows + verso fieldset ──────────────────── */
.cdx-field-row { display: flex; gap: 0.75rem; }
.cdx-field-row .cdx-field { flex: 1; min-width: 0; }

.cdx-cert-verso {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.5rem 0.85rem 0.85rem;
  margin: 0.4rem 0 0.9rem;
}
.cdx-cert-verso legend {
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-secondary);
  padding: 0 0.4rem;
}
.cdx-cert-verso textarea {
  width: 100%;
  resize: vertical;
  font-family: inherit;
  font-size: 0.85rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text-primary);
  outline: none;
}
.cdx-cert-verso textarea:focus { border-color: var(--accent-color, #8b5cf6); }
[data-theme="dark"] .cdx-cert-verso textarea { background: var(--surface); border-color: var(--border); color: var(--text-primary); }

.cdx-field-hint { display: block; font-size: 0.74rem; color: var(--text-secondary); margin-top: 0.25rem; }

/* ── Responsive ────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .cdx-certs-modelos { flex-direction: column; height: auto; }
  .cdx-certs-sidebar { width: 100%; border-right: none; border-bottom: 1px solid var(--border); max-height: 200px; }
  .cdx-field-row { flex-direction: column; gap: 0; }
}

/* ── Emissão dashboard (ported from backstage/mocks/emissao/a3.html) ──────────
   Conceito C: faixa de KPIs (clicáveis = filtro de status) + tabela densa
   ordenável com select-all no header + barra de ações em massa. Cores de status:
   amber (aguardando assinatura) / blue (aguardando envio) / green / red. */
.cdx-emissao {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem 1.5rem;
  min-height: 0;
}

.cdx-emissao-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.7rem;
}
.cdx-emissao-kpi {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  text-align: left;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left-width: 4px;
  border-radius: 12px;
  padding: 0.7rem 0.9rem;
  cursor: pointer;
  font: inherit;
  transition: transform 0.12s, box-shadow 0.12s;
}
.cdx-emissao-kpi:hover { transform: translateY(-1px); box-shadow: 0 8px 20px var(--shadow); }
.cdx-emissao-kpi.is-active { box-shadow: 0 0 0 2px var(--primary); }
.cdx-emissao-kpi-n { font-size: 1.7rem; font-weight: 700; line-height: 1; color: var(--text-primary); }
.cdx-emissao-kpi-l { font-size: 0.72rem; color: var(--text-secondary); }
.cdx-emissao-kpi--issued  { border-left-color: var(--cdx-cert-issued-ac); }
.cdx-emissao-kpi--signed  { border-left-color: var(--cdx-cert-signed-ac); }
.cdx-emissao-kpi--sent    { border-left-color: var(--cdx-cert-sent-ac); }
.cdx-emissao-kpi--revoked { border-left-color: var(--cdx-cert-revoked-ac); }
[data-theme="dark"] .cdx-emissao-kpi { background: var(--surface); border-color: var(--border); }

.cdx-emissao-spacer { flex: 1; }

.cdx-emissao-tablewrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 6px 22px var(--shadow);
  overflow: auto;
}
[data-theme="dark"] .cdx-emissao-tablewrap { background: var(--surface); border-color: var(--border); }

.cdx-emissao-table th.cdx-emissao-th { cursor: pointer; user-select: none; white-space: nowrap; }
.cdx-emissao-table th.cdx-emissao-th:hover { color: var(--text-primary); }
.cdx-emissao-table th.is-sorted { color: var(--primary); }
.cdx-emissao-sort { font-size: 0.7em; }
.cdx-emissao-cbcol { width: 36px; text-align: center; }
.cdx-emissao-cbcol input { width: 16px; height: 16px; accent-color: var(--primary); cursor: pointer; }
.cdx-emissao-table tr.is-selected td { background: var(--cdx-card-sel-bg, rgba(20,184,166,0.10)); }

/* Inline bulk-action bar: sits in the flow between the toolbar and the table,
 * revealed only when rows are selected. Themed surface (no fixed floating bar,
 * no hardcoded colors), so it reads correctly in light + dark. */
.cdx-emissao-bulk {
  display: none;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  background: var(--cdx-chip-bg);
  border: 1px solid var(--cdx-chip-border);
  border-radius: 10px;
  padding: 0.5rem 0.7rem;
}
.cdx-emissao-bulk.is-on { display: flex; }
.cdx-emissao-bulk b { font-size: 0.85rem; white-space: nowrap; padding-right: 0.2rem; color: var(--text-primary); }

@media (max-width: 880px) { .cdx-emissao-kpis { grid-template-columns: repeat(2, 1fr); } }