/**
 * Quiovo — Tokens de diseño (T10.5-DS1)
 * =====================================
 * SOLO variables. Sin selectores de componente, sin reglas que no sean :root.
 * Fuente de marca: --qv-brand = #3c2ab5 (muestreado del isotipo original).
 *
 * No carga fuentes externas (Google Fonts etc.). En DS2 se autoalojará la
 * tipografía; hasta entonces se usa un stack de sistema.
 */

:root {
    /* ------------------------------------------------------------------ */
    /* Color — marca                                                       */
    /* ------------------------------------------------------------------ */
    --qv-brand:        #3c2ab5; /* primario exacto muestreado del isotipo */
    --qv-brand-hover:  #30219a; /* ~10% más oscuro (hover/active)        */
    --qv-brand-soft:   #eeecfb; /* tinte muy claro sobre blanco          */

    /* ------------------------------------------------------------------ */
    /* Color — neutros cálidos                                             */
    /* ------------------------------------------------------------------ */
    --qv-ink:          #211d2b; /* texto principal (casi negro cálido)   */
    --qv-ink-2:        #3d3748; /* texto secundario fuerte               */
    --qv-muted:        #6b6478; /* texto atenuado / metadatos            */
    --qv-line:         #e6e3ec; /* bordes y separadores                  */
    --qv-bg:           #faf9fc; /* fondo de página (blanco cálido)       */
    --qv-surface:      #ffffff; /* superficies / tarjetas                */

    /* ------------------------------------------------------------------ */
    /* Color — semánticos                                                  */
    /* ------------------------------------------------------------------ */
    --qv-success:      #1f8a4c;
    --qv-warning:      #b7791f;
    --qv-danger:       #c0392b;
    --qv-info:         #2563eb;

    /* ------------------------------------------------------------------ */
    /* Color — semánticos de TEXTO (T10.5-DS4b)                            */
    /* Tinta oscura para texto/badge sobre el fondo suave del mismo tono.  */
    /* Ratios medidos (tools/_ds4b1_contrast.php), todos >= 7:1 (AA/AAA):  */
    /*   success-ink #14612f sobre #f1faf4 = 7.09  (sobre blanco 7.55)     */
    /*   warning-ink #6b4708 sobre #fdf8ef = 7.85  (sobre blanco 8.30)     */
    /*   danger-ink  #8a2318 sobre #fdf3f2 = 8.26  (sobre blanco 9.00)     */
    /*   info-ink    #1e3a8a sobre #f2f6fe = 9.56  (sobre blanco 10.36)    */
    /* ------------------------------------------------------------------ */
    --qv-success-ink:  #14612f;
    --qv-warning-ink:  #6b4708;
    --qv-danger-ink:   #8a2318;
    --qv-info-ink:     #1e3a8a;

    /* ------------------------------------------------------------------ */
    /* Tipografía                                                          */
    /* ------------------------------------------------------------------ */
    --qv-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
                    Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji";

    /* Escala de tamaños (rem, base 16px) */
    --qv-fs-xs:   0.75rem;  /* 12px */
    --qv-fs-sm:   0.875rem; /* 14px */
    --qv-fs-md:   1rem;     /* 16px */
    --qv-fs-lg:   1.125rem; /* 18px */
    --qv-fs-xl:   1.25rem;  /* 20px */
    --qv-fs-2xl:  1.5rem;   /* 24px */
    --qv-fs-3xl:  1.875rem; /* 30px */
    --qv-fs-4xl:  2.25rem;  /* 36px */

    /* Pesos */
    --qv-fw-regular:  400;
    --qv-fw-medium:   500;
    --qv-fw-semibold: 600;
    --qv-fw-bold:     700;

    /* Interlineado */
    --qv-lh-tight: 1.2;
    --qv-lh-base:  1.5;
    --qv-lh-loose: 1.7;

    /* ------------------------------------------------------------------ */
    /* Forma — radios                                                      */
    /* ------------------------------------------------------------------ */
    --qv-r-sm: 4px;
    --qv-r-md: 8px;
    --qv-r-lg: 16px;

    /* ------------------------------------------------------------------ */
    /* Forma — sombras suaves                                              */
    /* ------------------------------------------------------------------ */
    --qv-shadow-sm: 0 1px 2px rgba(33, 29, 43, 0.06);
    --qv-shadow-md: 0 2px 8px rgba(33, 29, 43, 0.08);
    --qv-shadow-lg: 0 8px 24px rgba(33, 29, 43, 0.10);

    /* ------------------------------------------------------------------ */
    /* Espaciado — múltiplos de 4/8                                        */
    /* ------------------------------------------------------------------ */
    --qv-space-1:  4px;
    --qv-space-2:  8px;
    --qv-space-3:  12px;
    --qv-space-4:  16px;
    --qv-space-5:  20px;
    --qv-space-6:  24px;
    --qv-space-8:  32px;
    --qv-space-10: 40px;
    --qv-space-12: 48px;
    --qv-space-16: 64px;
}