/* ──────────────────────────────────────────────────────────────────────────
 * HARVI 3D — TOKENS CANÓNICOS (light DOM)
 *
 * Único lugar donde se definen los tokens de la plataforma. Lo cargan:
 *   - common.css (vía @import) → los 11 visores.
 *   - el menú (index.php) y el login (login/index.php) directamente.
 * Los componentes <s3d-*> (Shadow DOM) usan el espejo --s3d-* de
 * shared/components/s3d-tokens.css; ver docs/ui-conventions.md → "Tokens".
 *
 * Capas (de más a menos canónica):
 *   1. --bg --l1 --l2 --la --bs --bst --tp --ts --ph --int --inth --err …   (esta hoja)
 *   2. --sp-* --h-* --fs-* --icon-* --z-* --dur-* --focus                    (esta hoja)
 *   3. --d-*   capa oscura Carbon g100 (menú, login hero, splash)             (esta hoja)
 *   4. --cds-* ALIAS de compatibilidad de (1); NO usar en código nuevo.
 *   5. --s3d-* espejo para Shadow DOM (s3d-tokens.css).
 * Los valores de 1 y 2 coinciden con los de 5: si cambias uno, cambia el otro.
 * ────────────────────────────────────────────────────────────────────────── */
:root {
    /* ── 1. Superficies, bordes, texto, interacción, estado ── */
    --bg:       #f4f4f4;
    --l1:       #ffffff;
    --l2:       #f4f4f4;
    --la:       #e0e0e0;
    --bs:       #e0e0e0;
    --bst:      #8d8d8d;
    --tp:       #161616;
    --ts:       #525252;
    --ph:       #a8a8a8;    /* SOLO placeholder / deshabilitado (2,38:1 sobre blanco). Para ayuda usar --ts */
    --int:      #0f62fe;
    --inth:     #0353e9;
    --err:      #da1e28;
    --success:  #198038;
    --warn:     #f1c21b;
    --overlay:  rgba(22,22,22,0.5);

    /* ── 2. Escalas ── */
    --h-xs:     22px;
    --h-sm:     28px;
    --h-md:     32px;
    --h-lg:     40px;
    --fs-xs:    10px;
    --fs-sm:    11px;
    --fs-base:  12px;
    --fs-md:    13px;
    --fs-lg:    14px;
    --icon-sm:  12px;
    --icon-md:  14px;
    --icon-lg:  16px;
    --icon-xl:  32px;

    /* Espaciado (espejo de --s3d-sp-*) */
    --sp-1:     4px;
    --sp-2:     8px;
    --sp-3:     12px;
    --sp-4:     16px;
    --sp-5:     24px;

    /* Capas (z-index). Usar estos valores en CSS nuevo; el toast queda por encima de todo. */
    --z-overlay:         10;     /* overlays de carga/error dentro del viewport */
    --z-sticky:          100;    /* stats bar móvil, modales dentro del visor */
    --z-drawer-backdrop: 190;
    --z-drawer:          200;
    --z-drawer-toggle:   220;

    /* Movimiento */
    --dur-fast: 0.12s;
    --dur-base: 0.2s;

    /* Foco visible canónico (ver common.css → :focus-visible) */
    --focus:    var(--int);

    /* Tokens semánticos de medición (los usan .measure-item y los visores) */
    --measure-dist:  var(--warn);
    --measure-area:  var(--int);
    --measure-angle: var(--success);
    --measure-point: #ff832b;

    /* Superficies fijas */
    --viewport-bg: #161616;    /* fondo del lienzo/visor (geotiff, heatmap y curvas aún usan #0a0a0a local) */
    --err-bg:      #fff1f1;    /* fondo de mensajes de error (Carbon red-10) */
    --err-bd:      #ffd7d9;    /* borde de mensajes de error (Carbon red-20) */

    /* ── 3. Capa oscura Carbon g100 (menú, login, splash, tour) ── */
    --d-bg:      #161616;
    --d-l1:      #262626;
    --d-l2:      #393939;
    --d-bs:      #393939;
    --d-bst:     #6f6f6f;
    --d-tp:      #f4f4f4;
    --d-ts:      #c6c6c6;
    --d-th:      #8d8d8d;   /* texto de ayuda sobre oscuro (5,5:1 sobre #161616) */
    --d-int:     #0f62fe;
    --d-int-h:   #4589ff;   /* azul 50: texto/enlace sobre oscuro (>=4,5:1) */

    /* ── 4. ALIAS --cds-* (compatibilidad). Antes redefinidos en geotiff, heatmap,
          curvas, elevacion y dwg; ahora vienen de aquí, esas copias pueden borrarse. ── */
    --cds-background:        var(--bg);
    --cds-layer-01:          var(--l1);
    --cds-layer-02:          var(--l2);
    --cds-layer-accent:      var(--la);
    --cds-border-subtle:     var(--bs);
    --cds-border-strong:     var(--bst);
    --cds-text-primary:      var(--tp);
    --cds-text-secondary:    var(--ts);
    --cds-text-placeholder:  var(--ph);
    --cds-text-helper:       var(--bst);   /* mismo valor que el fallback #8d8d8d que usaban heatmap/etc. */
    --cds-interactive:       var(--int);
    --cds-interactive-hover: var(--inth);
    --cds-support-success:   var(--success);
    --cds-support-error:     var(--err);
    --cds-support-warning:   var(--warn);
    --cds-focus:             var(--int);
    --cds-overlay:           var(--overlay);
    --radius-sm: 0px; --radius-md: 0px; --radius-lg: 0px; --radius-pill: 0px;
}