/* F1 — Test Management Design Tokens (QMetry-style compact foundation) */
/* UI-S01: --tm-* vars aliased to --pg-* source of truth (pg-tokens.css) */
:root {
    /* ── Color: Neutral ────────────────────── */
    --tm-bg: #f7f8fa;
    --tm-surface: #ffffff;
    --tm-surface-hover: #f0f2f5;
    --tm-surface-active: #e8f0fe;
    --tm-border: #e0e3e8;
    --tm-border-strong: #c4c9d0;

    /* ── Color: Text ───────────────────────── */
    --tm-text-primary: #1a1d21;
    --tm-text-secondary: #5f6368;
    --tm-text-tertiary: #9aa0a6;
    --tm-text-inverse: #ffffff;

    /* ── Color: Accent ─────────────────────── */
    --tm-accent: #1a73e8;
    --tm-accent-hover: #1557b0;
    --tm-accent-light: #e8f0fe;

    /* ── Color: Semantic ───────────────────── */
    --tm-pass: #34a853;
    --tm-fail: #ea4335;
    --tm-blocked: #f9ab00;
    --tm-not-run: #9aa0a6;
    --tm-deferred: #673ab7;
    --tm-info: #1a73e8;
    --tm-info-light: #e8f0fe;

    /* ── Spacing (8-step scale) ─────────────── */
    --sp-2xs: 2px;
    --sp-xs: 4px;
    --sp-sm: 8px;
    --sp-md: 12px;
    --sp-lg: 16px;
    --sp-xl: 20px;
    --sp-2xl: 24px;
    --sp-3xl: 32px;

    /* ── Border Radius ─────────────────────── */
    --radius-sm: 3px;
    --radius-md: 6px;
    --radius-lg: 10px;

    /* ── Shadow (4 levels) ─────────────────── */
    --tm-shadow-none: none;
    --tm-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --tm-shadow-md: 0 4px 14px rgba(15, 23, 42, 0.08);
    --tm-shadow-lg: 0 10px 30px rgba(15, 23, 42, 0.12);

    /* ── Typography — aliases to global type scale (main.css --fs-*) ── */
    --tm-font-family:  var(--font-family);
    --tm-font-mono:    var(--font-mono);

    /* Size aliases — always in sync with the global scale */
    --tm-font-2xs: var(--fs-2xs);  /* 10px */
    --tm-font-xs:  var(--fs-xs);   /* 11px */
    --tm-font-sm:  var(--fs-sm);   /* 12px */
    --tm-font-base:var(--fs-base); /* 13px */
    --tm-font-md:  var(--fs-md);   /* 14px */
    --tm-font-lg:  var(--fs-lg);   /* 16px */
    --tm-font-xl:  var(--fs-xl);   /* 18px */
    --tm-font-2xl: var(--fs-2xl);  /* 22px */
    --tm-font-3xl: var(--fs-3xl);  /* 28px */

    /* Weight aliases */
    --tm-fw-light:    var(--fw-light);    /* 300 */
    --tm-fw-normal:   var(--fw-normal);   /* 400 */
    --tm-fw-medium:   var(--fw-medium);   /* 500 */
    --tm-fw-semibold: var(--fw-semibold); /* 600 */
    --tm-fw-bold:     var(--fw-bold);     /* 700 */

    /* Line-height aliases */
    --tm-lh-tight:    var(--lh-tight);    /* 1.2 */
    --tm-lh-normal:   var(--lh-normal);   /* 1.4 */
    --tm-lh-relaxed:  var(--lh-relaxed);  /* 1.5 */

    /* Letter-spacing aliases */
    --tm-ls-normal:   var(--ls-normal);
    --tm-ls-wide:     var(--ls-wide);
    --tm-ls-widest:   var(--ls-widest);   /* 0.05em */

    /* ── Density ────────────────────────────── */
    --tm-row-height: 32px;
    --tm-row-padding: 4px 8px;
    --tm-cell-font-size:   var(--fs-sm);  /* 12px */
    --tm-header-font-size: var(--fs-xs);  /* 11px */
    --tm-density-line-height: var(--lh-tight); /* 1.2 */

    /* ── Transitions ───────────────────────── */
    --tm-transition-fast: 100ms ease;
    --tm-transition-normal: 150ms ease;
    --tm-transition-slow: 250ms ease;

    /* ── Z-index layers ────────────────────── */
    --tm-z-dropdown: 100;
    --tm-z-modal-backdrop: 200;
    --tm-z-modal: 210;
    --tm-z-toast: 300;
    --tm-z-context-menu: 150;

    /* ── UI-S01: --pg-* aliases for backward compat ─────── */
    /* These map legacy --tm-* consumers to the new token system. */
    /* Remove after UI-S02 migration is complete.               */
    --tm-accent:          var(--pg-color-primary);
    --tm-accent-hover:    var(--pg-color-primary-hover);
    --tm-accent-light:    var(--pg-color-primary-light);
    --tm-bg:              var(--pg-color-bg);
    --tm-surface:         var(--pg-color-surface);
    --tm-border:          var(--pg-color-border);
    --tm-border-strong:   var(--pg-color-border-strong);
    --tm-text-primary:    var(--pg-color-text);
    --tm-text-secondary:  var(--pg-color-text-secondary);
    --tm-text-tertiary:   var(--pg-color-text-tertiary);
    --tm-shadow-sm:       var(--pg-shadow-sm);
    --tm-shadow-md:       var(--pg-shadow-md);
    --tm-shadow-lg:       var(--pg-shadow-lg);
    --tm-transition-fast:   var(--pg-t-fast);
    --tm-transition-normal: var(--pg-t-normal);
    --tm-transition-slow:   var(--pg-t-slow);
}