/* ============================================================
 * AI News Social — shared visualization palette (V3, 2026-04-18)
 *
 * CSS custom properties consumed by the 32 Plotly/D3 visualization
 * HTMLs that ship with each week's edition. Any viz generator that
 * wants to participate in the V3 palette can link this file and use
 * these tokens (directly in embedded styles or via fetch-on-load).
 *
 * Legacy v2 visualizations ignore this file harmlessly; they keep
 * their baked-in palettes until regenerated.
 * ============================================================ */

:root {
    /* Foundation */
    --viz-bg:         #FAFAF5;
    --viz-fg:         #2A2A2A;
    --viz-subtle:     #6B6B6B;
    --viz-border:     #D8D8D2;
    --viz-accent:     #A2392B;

    /* Manufacturing-the-Menace palette */
    --viz-sand:         #D9CAB3;
    --viz-sage:         #A3B18A;
    --viz-olive:        #588157;
    --viz-burnt-orange: #CC5500;
    --viz-burgundy:     #7B2D26;
    --viz-navy:         #1C3D5A;

    /* Category colors */
    --viz-cat-sa:  #7B2D26;  /* Social Aspects of AI */
    --viz-cat-ail: #A3B18A;  /* AI Literacy */
    --viz-cat-ait: #CC5500;  /* AI Tools */
    --viz-cat-he:  #1C3D5A;  /* Higher Education */

    /* Sequential scale (for ordinal data) */
    --viz-seq-1: #D9CAB3;
    --viz-seq-2: #A3B18A;
    --viz-seq-3: #588157;
    --viz-seq-4: #1C3D5A;
    --viz-seq-5: #7B2D26;

    /* Divergent scale (low / mid / high) */
    --viz-div-low:  #A3B18A;
    --viz-div-mid:  #D9CAB3;
    --viz-div-high: #7B2D26;

    /* Typography */
    --viz-font-body:  'Inter', system-ui, -apple-system, sans-serif;
    --viz-font-head:  Georgia, 'Times New Roman', serif;
    --viz-font-mono:  'IBM Plex Mono', 'SF Mono', Menlo, monospace;
}

/* Typography + background defaults viz HTMLs can opt into */
.viz-v3-themed, .viz-v3-themed body {
    background-color: var(--viz-bg) !important;
    color: var(--viz-fg) !important;
    font-family: var(--viz-font-body) !important;
}
.viz-v3-themed h1, .viz-v3-themed h2, .viz-v3-themed h3 {
    font-family: var(--viz-font-head) !important;
    color: var(--viz-fg) !important;
    font-weight: 400 !important;
}
.viz-v3-themed text, .viz-v3-themed tspan {
    fill: var(--viz-fg) !important;
    font-family: var(--viz-font-body) !important;
}