/* M-Twice Leadgen -- styles layered on top of Tailwind (Play CDN).
   Design system: dense, functional, no decorative animation. */

:root { color-scheme: light; }
body { -webkit-font-smoothing: antialiased; }

[x-cloak] { display: none !important; }

/* Short, functional transitions only (~120ms). */
.btn, .chip, .data-table tbody tr, a { transition: background-color .12s ease, color .12s ease, border-color .12s ease; }

/* --- Chips (status / labels) --- */
.chip {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: 11px; font-weight: 600; line-height: 1;
  padding: 3px 8px; border-radius: 9999px; white-space: nowrap;
}
.chip-teal   { background: #e3f5f5; color: #1f7a79; }
.chip-dark   { background: #e8e6e1; color: #444444; }
.chip-ok     { background: #e4f1e6; color: #2f7c3d; }
.chip-warn   { background: #fff4dc; color: #9a7414; }
.chip-danger { background: #f8e3e0; color: #a8392c; }
.chip-muted  { background: #efeadf; color: #7a7363; }

/* --- Status dots --- */
.dot { width: 9px; height: 9px; border-radius: 9999px; display: inline-block; }
.dot-teal   { background: #43c0bf; }
.dot-dark   { background: #9a9384; }
.dot-ok     { background: #3fa050; }
.dot-warn   { background: #e8b547; }
.dot-danger { background: #d04a3a; }
.dot-muted  { background: #c9c2b2; }

/* --- Buttons --- */
.btn {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: 13px; font-weight: 500; padding: 6px 12px;
  border-radius: 6px; border: 1px solid #d8d2c4;
  background: #ffffff; color: #1A1A1A; cursor: pointer; text-decoration: none;
}
.btn:hover { background: #f3efe6; }
.btn-primary { background: #43c0bf; border-color: #43c0bf; color: #ffffff; }
.btn-primary:hover { background: #3aa9a8; }
.btn-danger { color: #d04a3a; border-color: #e6c3bd; }
.btn-danger:hover { background: #f8e3e0; }
.btn[disabled], .btn:disabled { opacity: .42; cursor: not-allowed; }
.btn[disabled]:hover, .btn:disabled:hover { background: #ffffff; }
.btn-primary[disabled]:hover { background: #43c0bf; }

/* --- Cards --- */
.card { background: #ffffff; border: 1px solid #E6E0D4; border-radius: 8px; }
.card-title {
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: #8a8273;
}

/* --- Data table --- */
.data-table { border-collapse: collapse; }
.data-table th { user-select: none; }
.data-table tbody tr:hover { background: #f3efe6; }

/* --- Key/value tables --- */
.kv td { padding: 5px 0; vertical-align: top; }
.kv td:first-child { color: #8a8273; width: 40%; padding-right: 12px; }

/* Monospace helper */
.mono { font-family: 'JetBrains Mono', 'SF Mono', Consolas, monospace; }