/* Numerario branding overlay
 * Aplica sobre finaiops/advisor sin modificar su CSS. Pegar después del CSS principal.
 * Source of truth: ~/Research/finops-research-2025/06-lanzamiento/MARCA-Y-BRANDING.md §7
 */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&family=EB+Garamond:wght@500;600&display=swap');

:root {
  /* Tinta Senado */
  --num-color-primary-50: #f4f7fb;
  --num-color-primary-100: #e1e9f2;
  --num-color-primary-500: #1b3a5c;
  --num-color-primary-700: #0f2540;
  --num-color-primary-900: #06121f;
  /* Acero Verificado (CTA digital) */
  --num-color-cta-500: #1f3a5f;
  /* Pergamino */
  --num-color-surface-50: #fbf8f1;
  --num-color-surface-100: #f4efe6;
  /* Verde Erario */
  --num-color-success-500: #2f5d4f;
  /* Bronce Antiguo */
  --num-color-bronze-500: #a07744;
  /* Sello Burdeos (uso ceremonial) */
  --num-color-seal-500: #6b1e26;
  /* Stone */
  --num-color-neutral-500: #6b7385;
  /* Semantic */
  --num-color-warn: #b8860b;
  --num-color-error: #a23b26;

  --num-type-display: 'EB Garamond', 'GT Sectra', Georgia, serif;
  --num-type-body: 'IBM Plex Sans', Inter, system-ui, sans-serif;
  --num-type-mono: 'IBM Plex Mono', ui-monospace, monospace;
}

/* Body defaults — pergamino canvas + tinta senado text */
body[data-numerario-brand],
html[data-numerario-brand] body {
  font-family: var(--num-type-body);
  background: var(--num-color-surface-50);
  color: var(--num-color-primary-700);
}

/* Brand hooks — finaiops/advisor opt-in via class names */
.num-brand-header {
  background: var(--num-color-primary-500);
  color: var(--num-color-surface-50);
  font-family: var(--num-type-display);
}

.num-brand-cta,
.num-brand-cta button,
button.num-brand-cta {
  background: var(--num-color-cta-500);
  color: var(--num-color-surface-50);
  border: none;
  padding: var(--num-space-3, 12px) var(--num-space-4, 16px);
  border-radius: var(--num-radius-md, 8px);
  font-family: var(--num-type-body);
  font-weight: 500;
  cursor: pointer;
}

.num-brand-cta:hover {
  background: var(--num-color-primary-500);
}

/* Numerario badges (verde erario / sello burdeos) */
.num-badge-focus-verified {
  background: var(--num-color-success-500);
  color: var(--num-color-surface-50);
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-family: var(--num-type-mono);
  letter-spacing: 0.02em;
}

.num-badge-seal {
  background: var(--num-color-seal-500);
  color: var(--num-color-surface-50);
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-family: var(--num-type-mono);
}

/* Mono for FOCUS / SQL blocks */
code,
pre,
.num-mono {
  font-family: var(--num-type-mono);
}

/* Display headings */
h1.num-display,
h2.num-display,
.num-display {
  font-family: var(--num-type-display);
  letter-spacing: -0.01em;
}