/**
 * Slate + stone + arbitrary utilities for Tailwind v2 CDN (v2 build omits newer palettes).
 * Served from 'self' — safe under CSP. Used by /simulation, /msp/command-center, etc.
 */

/* ── Slate palette (matches Tailwind v3 slate) ── */
.bg-slate-50 { background-color: #f8fafc !important; }
.bg-slate-100 { background-color: #f1f5f9 !important; }
.bg-slate-200 { background-color: #e2e8f0 !important; }
.bg-slate-300 { background-color: #cbd5e1 !important; }
.bg-slate-400 { background-color: #94a3b8 !important; }
.bg-slate-500 { background-color: #64748b !important; }
.bg-slate-600 { background-color: #475569 !important; }
.bg-slate-700 { background-color: #334155 !important; }
.bg-slate-800 { background-color: #1e293b !important; }
.bg-slate-900 { background-color: #0f172a !important; }
.bg-slate-950 { background-color: #020617 !important; }

.text-slate-100 { color: #f1f5f9 !important; }
.text-slate-200 { color: #e2e8f0 !important; }
.text-slate-300 { color: #cbd5e1 !important; }
.text-slate-400 { color: #94a3b8 !important; }
.text-slate-500 { color: #64748b !important; }
.text-slate-600 { color: #475569 !important; }
.text-slate-700 { color: #334155 !important; }
.text-slate-800 { color: #1e293b !important; }

.border-slate-200 { border-color: #e2e8f0 !important; }
.border-slate-600 { border-color: #475569 !important; }
.border-slate-700 { border-color: #334155 !important; }
.border-slate-800 { border-color: #1e293b !important; }

.border-t-slate-800 { border-top-color: #1e293b !important; }

.hover\:bg-slate-700:hover { background-color: #334155 !important; }
.hover\:bg-slate-100:hover { background-color: #f1f5f9 !important; }
.hover\:text-slate-200:hover { color: #e2e8f0 !important; }
.hover\:border-slate-600:hover { border-color: #475569 !important; }
.hover\:border-slate-300:hover { border-color: #cbd5e1 !important; }

.bg-slate-950\/80 { background-color: rgba(2, 6, 23, 0.85) !important; }

/* Emerald alpha (trend pill) */
.bg-emerald-950\/50 { background-color: rgba(2, 44, 34, 0.5) !important; }
.border-emerald-800 { border-color: #065f46 !important; }

/* Modal overlay */
.bg-black\/50 { background-color: rgba(0, 0, 0, 0.5) !important; }
.bg-black\/60 { background-color: rgba(0, 0, 0, 0.6) !important; }

/* Ring on connect CTAs (arbitrary opacity not in Tailwind v2 build) */
.ring-1.ring-emerald-400\/40,
.ring-emerald-400\/40.ring-1 {
  box-shadow: 0 0 0 1px rgba(52, 211, 153, 0.45) !important;
}
.ring-1.ring-blue-300\/40,
.ring-blue-300\/40.ring-1 {
  box-shadow: 0 0 0 1px rgba(147, 197, 253, 0.45) !important;
}

/* Arbitrary font sizes (not in default Tailwind v2 build) */
.text-\[10px\] { font-size: 10px !important; line-height: 1.4 !important; }
.text-\[11px\] { font-size: 11px !important; line-height: 1.45 !important; }

.min-h-\[5rem\] { min-height: 5rem !important; }
.min-h-\[4px\] { min-height: 4px !important; }
.max-w-\[10rem\] { max-width: 10rem !important; }
.min-w-56 { min-width: 14rem !important; }

.line-clamp-2 {
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Fractional spacing (some builds omit these) */
.gap-0\.5 { gap: 0.125rem !important; }
.gap-1\.5 { gap: 0.375rem !important; }
.py-1\.5 { padding-top: 0.375rem !important; padding-bottom: 0.375rem !important; }
.px-2\.5 { padding-left: 0.625rem !important; padding-right: 0.625rem !important; }
.h-0\.5 { height: 0.125rem !important; }

/* divide-y + divide-slate-800 (MSP watchlist table rows) */
.divide-y.divide-slate-800 > :not([hidden]) ~ :not([hidden]) {
  border-top-width: 1px !important;
  border-top-color: #1e293b !important;
}

/* Light Command Center / MSP watchlist row dividers */
.divide-y.divide-stone-200 > :not([hidden]) ~ :not([hidden]) {
  border-top-width: 1px !important;
  border-top-color: #e7e5e4 !important;
}

.max-h-72 { max-height: 18rem !important; }

/* Body / nav: ensure dark base + sans font (no Times fallback) */
body.bg-slate-950 {
  background-color: #020617 !important;
  color: #f1f5f9;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ── Stone palette (parity with live Command Center / Tailwind v3 stone) ── */
.bg-stone-50 { background-color: #fafaf9 !important; }
.bg-stone-100 { background-color: #f5f5f4 !important; }
.bg-stone-200 { background-color: #e7e5e4 !important; }
.bg-stone-300 { background-color: #d6d3d1 !important; }
.bg-stone-500 { background-color: #78716c !important; }
.bg-stone-700 { background-color: #44403c !important; }
.bg-stone-800 { background-color: #292524 !important; }
.bg-stone-900 { background-color: #1c1917 !important; }

.text-stone-500 { color: #78716c !important; }
.text-stone-600 { color: #57534e !important; }
.text-stone-700 { color: #44403c !important; }
.text-stone-800 { color: #292524 !important; }
.text-stone-900 { color: #1c1917 !important; }

.border-stone-200 { border-color: #e7e5e4 !important; }
.border-stone-300 { border-color: #d6d3d1 !important; }
.border-stone-400\/60 { border-color: rgba(168, 162, 158, 0.55) !important; }

.bg-stone-100\/95 { background-color: rgba(245, 245, 244, 0.95) !important; }
.bg-stone-200\/50 { background-color: rgba(231, 229, 228, 0.5) !important; }
.bg-stone-200\/70 { background-color: rgba(231, 229, 228, 0.7) !important; }
.bg-stone-200\/90 { background-color: rgba(231, 229, 228, 0.9) !important; }
.bg-stone-50\/60 { background-color: rgba(250, 250, 249, 0.62) !important; }
.bg-stone-50\/80 { background-color: rgba(250, 250, 249, 0.82) !important; }
.bg-stone-100\/80 { background-color: rgba(245, 245, 244, 0.82) !important; }
.bg-white\/90 { background-color: rgba(255, 255, 255, 0.92) !important; }
.bg-brand-50\/40 { background-color: rgba(239, 246, 255, 0.5) !important; }

.ring-1.ring-brand-200,
.ring-brand-200.ring-1 {
  box-shadow: 0 0 0 1px #bfdbfe !important;
}

.hover\:bg-stone-100:hover { background-color: #f5f5f4 !important; }
.hover\:bg-stone-300:hover { background-color: #d6d3d1 !important; }

/* Demo Command Center shell fallback (matches dashboard.css) */
.ca-command-center-shell {
  background-color: #f5f5f4;
  color: #1c1917;
}

/* MSP Command Center: ensure native <select> shows selected label (avoids blank closed state with disabled-only options) */
select.ca-msp-client-select {
  color: #1c1917 !important;
  background-color: #ffffff !important;
  white-space: nowrap;
}
select.ca-msp-client-select option {
  color: #1c1917;
  background-color: #ffffff;
}