:root {
  --ct-ink: #0f1419;
  --ct-accent: #e11d2e;
  --ct-accent-dark: #a30d1c;
  --ct-muted: #6b7280;
  --ct-border: #e5e7eb;
  --ct-bg: #f7f8fa;
}
html,body { background: var(--ct-bg); color: var(--ct-ink); font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif; }
.navbar-brand { font-weight: 700; letter-spacing: -0.3px; }
.brand-dot { display:inline-block; width: 10px; height: 10px; background: var(--ct-accent); border-radius: 2px; margin-right: 8px; transform: translateY(-2px); }
.topnav { background: #fff; border-bottom: 1px solid var(--ct-border); }
.sidenav { background:#fff; border-right:1px solid var(--ct-border); min-height: calc(100vh - 58px); }
.sidenav .nav-link { color: var(--ct-ink); padding: 10px 14px; border-radius: 6px; }
.sidenav .nav-link:hover { background: #f1f3f5; }
.sidenav .nav-link.active { background: var(--ct-ink); color: #fff; }
.sidenav .nav-link i { width: 18px; }
.page { display: none; padding: 24px 28px; }
.page.active { display: block; }
.card { border: 1px solid var(--ct-border); box-shadow: 0 1px 2px rgba(15,20,25,.03); }
.btn-primary { background: var(--ct-accent); border-color: var(--ct-accent); }
.btn-primary:hover { background: var(--ct-accent-dark); border-color: var(--ct-accent-dark); }
.btn-outline-primary { color: var(--ct-accent); border-color: var(--ct-accent); }
.btn-outline-primary:hover { background: var(--ct-accent); border-color: var(--ct-accent); color:#fff; }
.dropzone { border: 2px dashed var(--ct-border); border-radius: 10px; padding: 36px; text-align:center; color: var(--ct-muted); cursor: pointer; background: #fff; transition: all .15s ease; }
.dropzone:hover { border-color: var(--ct-accent); color: var(--ct-ink); background: #fff; }
.kpi { background:#fff; border:1px solid var(--ct-border); border-radius:10px; padding:18px; }
.kpi .label { font-size:12px; text-transform:uppercase; letter-spacing:.6px; color:var(--ct-muted); }
.kpi .value { font-size:28px; font-weight:700; margin-top:4px; }
.status-pill { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:3px 8px; border-radius:999px; }
.status-sent { background:#e7f6ee; color:#0a7a3b; }
.status-failed { background:#fdecee; color:#a30d1c; }
.status-sending { background:#eef2ff; color:#3646a8; }
.status-pending { background:#f1f3f5; color:#475569; }
.status-blocked { background:#fff6e5; color:#8a5a00; }
.status-done { background:#e7f6ee; color:#0a7a3b; }
.status-retry { background:#fff6e5; color:#8a5a00; }
.method-pill { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:600; padding:2px 7px; border-radius:4px; }
.method-t38  { background:#eaf4ff; color:#1e40af; }
.method-efax { background:#f3eaff; color:#5a1a9e; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.progress { height: 10px; }
.progress-bar { background: var(--ct-accent); }
.table > :not(caption) > * > * { padding: 10px 12px; }
.table thead th { font-size: 11px; text-transform: uppercase; letter-spacing:.6px; color:var(--ct-muted); background:#fafbfc; }
.help { font-size: 12px; color: var(--ct-muted); }
.pagehdr { display:flex; align-items:center; justify-content:space-between; margin-bottom: 18px; }
.pagehdr h4 { margin:0; font-weight: 700; letter-spacing: -0.2px; }
.tag { font-size:11px; text-transform:uppercase; letter-spacing:.6px; color: var(--ct-muted); }
.mockup-note { background:#fff8e1; border:1px solid #f4d37a; border-radius:8px; padding:10px 14px; font-size:13px; color:#6b4d00; margin-bottom:18px; }
