/**
 * MCF Design Tokens
 * Memory Care Foundation — memoryfnd.org
 *
 * Single source of truth for brand colors, spacing, and component standards.
 * Enqueued before all other MCF stylesheets so vars are available everywhere.
 */

:root {
    /* ---- Brand Colors ---- */
    --mcf-purple: #4e2166;
    --mcf-lavender: #c8a2c8;
    --mcf-gold-accent: #d4af37;
    --mcf-light-gray: #e8e7e1;
    --mcf-border-gray: #cac6c6;
    --mcf-sky-blue: #51bdfe;
    --mcf-green: #00cc99;

    /* ---- CTA Colors (WCAG AAA — 12:1 contrast) ---- */
    --mcf-cta: #4e2166;
    --mcf-cta-hover: #3a1850;
    --mcf-cta-text: #fff;

    /* ---- Text Colors ---- */
    --mcf-text-dark: #333;
    --mcf-text-body: #444;
    --mcf-text-subtle: #555;
    --mcf-text-muted: #666;
    --mcf-text-light: #777;
    --mcf-text-faint: #999;

    /* ---- Surface Colors ---- */
    --mcf-bg-highlight: #f9f7fc;
    --mcf-separator: #ccc;

    /* ---- Semantic Colors ---- */
    --mcf-error: #c0392b;
    --mcf-error-bg: #fdf2f2;
    --mcf-error-border: #f5c6cb;

    /* ---- Component Standards ---- */
    --mcf-btn-radius: 8px;
    --mcf-card-radius: 8px;
    --mcf-input-radius: 6px;

    /* ---- Transitions ---- */
    --mcf-transition: 0.2s ease;
}

/* ---- Reduced Motion ---- */
@media (prefers-reduced-motion: reduce) {
    :root {
        --mcf-transition: 0s;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}