/* ============================================================
   MEA Theme: Default (Light)
   Base semantic token layer — maps theme-agnostic variable names
   to the concrete design tokens. All other themes override these.
   ============================================================ */

:root,
[data-theme="default"] {
  /* ── Surfaces ── */
  --t-bg:              var(--mea-surface-page);
  --t-bg-elevated:     var(--mea-surface-card);
  --t-bg-recessed:     var(--mea-gray-50);
  --t-bg-hover:        var(--mea-gray-100);
  --t-bg-active:       var(--mea-gray-200);
  --t-bg-overlay:      rgba(0, 0, 0, 0.5);
  --t-bg-input:        var(--mea-surface-card);

  /* ── Text ── */
  --t-text:            var(--mea-gray-900);
  --t-text-secondary:  var(--mea-gray-700);
  --t-text-muted:      var(--mea-gray-600);
  --t-text-placeholder: var(--mea-gray-400);
  --t-text-inverse:    var(--mea-white);

  /* ── Borders ── */
  --t-border:          var(--mea-gray-200);
  --t-border-subtle:   var(--mea-gray-100);
  --t-border-strong:   var(--mea-gray-300);
  --t-border-input:    var(--mea-gray-200);
  --t-border-focus:    var(--mea-blue);

  /* ── Accent ── */
  --t-accent:          var(--mea-blue);
  --t-accent-hover:    var(--mea-blue-dark);
  --t-accent-light:    var(--mea-blue-50);
  --t-accent-text:     var(--mea-white);
  --t-accent-border:   var(--mea-baby-blue);

  /* ── Status ── */
  --t-success:         var(--mea-green);
  --t-success-bg:      var(--mea-green-light);
  --t-success-text:    var(--mea-green-dark);
  --t-error:           var(--mea-red);
  --t-error-bg:        var(--mea-red-light);
  --t-error-text:      var(--mea-red-dark);
  --t-warning:         var(--mea-amber);
  --t-warning-bg:      var(--mea-amber-light);
  --t-warning-text:    var(--mea-amber-dark);

  /* ── Interactive ── */
  --t-link:            var(--mea-blue);
  --t-link-hover:      var(--mea-blue-dark);
  --t-focus-ring:      var(--mea-baby-blue);

  /* ── Components ── */
  --t-card-bg:         var(--mea-surface-card);
  --t-card-border:     var(--mea-gray-200);
  --t-card-accent:     var(--mea-baby-blue);
  --t-sidebar-bg:      var(--mea-surface-sidebar);
  --t-sidebar-text:    var(--mea-white);
  --t-topbar-bg:       var(--mea-surface-card);
  --t-topbar-text:     var(--mea-gray-900);
  --t-modal-bg:        var(--mea-surface-card);
  --t-table-header-bg: var(--mea-gray-50);
  --t-table-hover:     var(--mea-gray-50);
  --t-badge-bg:        var(--mea-gray-100);
  --t-badge-text:      var(--mea-gray-700);
  --t-chip-bg:         var(--mea-surface-card);
  --t-chip-border:     var(--mea-gray-200);
  --t-chip-active-bg:  var(--mea-blue-50);
  --t-chip-active-border: var(--mea-blue);

  /* ── Typography scale (can be overridden for accessibility) ── */
  --t-font-base:       var(--mea-desk-lg);
  --t-font-sm:         var(--mea-desk-sm);
  --t-font-lg:         var(--mea-desk-xl);
  --t-line-height:     var(--mea-lh-normal);
  --t-letter-spacing:  var(--mea-ls-normal);

  /* ── Layout ── */
  --t-content-max-w:   none;
  --t-target-min:      44px;   /* minimum touch/click target */
  --t-spacing-scale:   1;      /* multiplier for voice/accessibility */
}