/* ============================================================
   theme.css — Capa de DESIGN TOKENS de INTEGRA*System
   ------------------------------------------------------------
   Fuente única de verdad para color, forma, sombra y espaciado.
   Los tokens se mapean sobre las variables de Bootstrap (--bs-*)
   para que se adapten solos al tema (light / semi-dark) sin
   duplicar reglas.

   REGLA: en componentes NO usar hex sueltos. Consumir --ui-*.
   Este archivo por sí solo NO cambia nada visualmente: solo
   define variables. El estilo se aplica donde se consumen.
   ============================================================ */

:root {

    /* ---- Marca (rampa índigo profesional, para acentos propios) ---- */
    --ui-brand-50:  #eef2ff;
    --ui-brand-100: #e0e7ff;
    --ui-brand-200: #c7d2fe;
    --ui-brand-400: #818cf8;
    --ui-brand-500: #6366f1;
    --ui-brand-600: #4f46e5;
    --ui-brand-700: #4338ca;
    --ui-brand-900: #312e81;

    /* Acento operativo: sigue al primary del template para no romper marca */
    --ui-brand:     var(--bs-primary, #4f46e5);
    --ui-brand-rgb: var(--bs-primary-rgb, 79, 70, 229);

    /* ---- Superficies (adaptan al tema Bootstrap activo) ---- */
    --ui-page:   var(--bs-body-bg, #f6f7fb);
    --ui-card:   var(--bs-card-bg, #ffffff);
    --ui-muted:  var(--bs-tertiary-bg, #f1f3f9);
    --ui-border: var(--bs-border-color, #e6e8f0);

    /* ---- Texto ---- */
    --ui-text:       var(--bs-body-color, #1f2937);
    --ui-text-muted: var(--bs-secondary-color, #6b7280);

    /* ---- Semánticos (estado del negocio) ---- */
    --ui-success:     var(--bs-success, #16a34a);
    --ui-success-rgb: var(--bs-success-rgb, 22, 163, 74);
    --ui-danger:      var(--bs-danger, #dc2626);
    --ui-danger-rgb:  var(--bs-danger-rgb, 220, 38, 38);
    --ui-warning:     var(--bs-warning, #f59e0b);
    --ui-warning-rgb: var(--bs-warning-rgb, 245, 158, 11);
    --ui-info:        var(--bs-info, #0ea5e9);
    --ui-info-rgb:    var(--bs-info-rgb, 14, 165, 233);

    /* ---- Forma ---- */
    --ui-radius-sm: .55rem;
    --ui-radius:    .9rem;
    --ui-radius-lg: 1.15rem;
    --ui-pill:      999px;

    /* ---- Sombra (una sola familia coherente) ---- */
    --ui-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
    --ui-shadow:    0 4px 12px rgba(16, 24, 40, .06), 0 2px 4px rgba(16, 24, 40, .04);
    --ui-shadow-lg: 0 12px 28px rgba(16, 24, 40, .10);

    /* ---- Espaciado (ritmo vertical) ---- */
    --ui-space-1: .25rem;
    --ui-space-2: .5rem;
    --ui-space-3: .75rem;
    --ui-space-4: 1rem;
    --ui-space-5: 1.5rem;
    --ui-space-6: 2rem;
}

/* Gradiente estandar de hero de modulo (UI §4). Azul fuerte -> azul grisaceo. */
:root {
    --ui-grd-hero: linear-gradient(135deg, #183b61 0%, #22547f 58%, #2f6d9b 100%);
}