/* belico-dark.css — coherencia visual con el dashboard (Next.js Tailwind dark theme).
 * Override de variables Material para el scheme "slate" (dark default).
 * Tokens mapean al card pattern del CLAUDE.md:
 *   p-4 rounded-xl border border-gray-800/60 bg-gray-900/40
 */

[data-md-color-scheme="slate"] {
  --md-default-bg-color: #0a0a0f;        /* gray-950 (dashboard bg) */
  --md-default-fg-color: #e5e7eb;        /* gray-200 */
  --md-primary-fg-color: #6366f1;        /* indigo-500 (branding Belico) */
  --md-primary-fg-color--light: #818cf8; /* indigo-400 */
  --md-primary-fg-color--dark: #4f46e5;  /* indigo-600 */
  --md-accent-fg-color: #a78bfa;         /* violet-400 */
  --md-code-bg-color: #111827;           /* gray-900 (card) */
  --md-code-fg-color: #e5e7eb;
}

/* Card pattern: admonitions con border y radio coherentes con el dashboard. */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 0.75rem;                       /* rounded-xl */
  border: 1px solid rgba(31, 41, 55, 0.6);      /* border-gray-800/60 */
  background: rgba(17, 24, 39, 0.4);            /* bg-gray-900/40 */
}

/* Tablas (catálogos auto-gen) con borde sutil coherente. */
[data-md-color-scheme="slate"] .md-typeset table:not([class]) {
  border: 1px solid rgba(31, 41, 55, 0.6);
  border-radius: 0.5rem;
  overflow: hidden;
}