/* Email tracking (public/mail-track.js). The same file is in every CCC; the
   colors come from each console's own tokens, with plain fallbacks. */
.mt { --mt-line: var(--line, #DEE3E5); --mt-dim: var(--text-3, var(--muted, #58636B)); --mt-card: var(--surface-1, var(--field, #fff));
      --mt-accent: var(--accent, var(--tan-deep, #0D6595)); max-width: 1100px; }
.mt h2 { margin: 0 0 6px; }
.mt h3 { margin: 26px 0 8px; }
.mt-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.mt-controls { display: flex; gap: 8px; flex-wrap: wrap; }
.mt-controls input, .mt-controls select { padding: 8px 10px; border: 1px solid var(--mt-line); border-radius: 8px; font: inherit; background: var(--mt-card); color: inherit; }
.mt-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin: 8px 0; }
.mt-stats div { background: var(--mt-card); border: 1px solid var(--mt-line); border-radius: 12px; padding: 12px 14px; }
.mt-stats b { display: block; font-size: 26px; line-height: 1.1; }
.mt-stats span { font-size: 13px; color: var(--mt-dim); }
.mt-hint, .mt-empty { color: var(--mt-dim); font-size: 13px; }
.mt-empty { padding: 24px 0; }
.mt-table { width: 100%; border-collapse: collapse; background: var(--mt-card); border: 1px solid var(--mt-line); border-radius: 12px; overflow: hidden; }
.mt-table th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--mt-dim); padding: 10px 12px; border-bottom: 1px solid var(--mt-line); }
.mt-table td { padding: 10px 12px; border-bottom: 1px solid var(--mt-line); vertical-align: top; font-size: 14px; }
.mt-table tr:last-child td { border-bottom: 0; }
.mt-table small { display: block; color: var(--mt-dim); font-size: 12px; word-break: break-all; }
.mt-table td > small:only-child, .mt-table td b + small { margin-top: 2px; }
.mt-row { cursor: pointer; }
.mt-row:hover td, .mt-row:focus td { background: rgba(127,127,127,.08); }
.mt-tag { display: inline-block; font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: var(--mt-accent); color: #fff; vertical-align: 1px; }
.mt-back { border: 1px solid var(--mt-line); background: var(--mt-card); color: inherit; border-radius: 8px; padding: 7px 12px; font: inherit; cursor: pointer; margin-bottom: 12px; }
@media (max-width: 640px) {
  .mt-table th:nth-child(2), .mt-table td:nth-child(2) { display: none; }
}
