/* ───────────────────────────────────────────
   COLOR UTILITIES – basadas en tokens.css
   ───────────────────────────────────────────*/

/* Accent */
.u-color-accent-500  { color:            var(--color-accent-500); }
.u-bg-accent-500     { background-color: var(--color-accent-500); }
.u-border-accent-500 { border-color:     var(--color-accent-500); }

/* Surface */
.u-bg-surface-app      { background-color: var(--color-surface-app); }
.u-bg-surface-neutral  { background-color: var(--color-surface-neutral); }

/* Border helpers (sólo borde, no texto) */
.u-border-container { border-color: var(--color-border-container); }
.u-border-input     { border-color: var(--color-border-input); }

/* ─── Feedback – Info ───────────────────────*/
.u-color-feedback-info-100  { color:            var(--color-feedback-info-100); }
.u-color-feedback-info-500  { color:            var(--color-feedback-info-500); }
.u-color-feedback-info-700  { color:            var(--color-feedback-info-700); }

.u-bg-feedback-info-100     { background-color: var(--color-feedback-info-100); }
.u-bg-feedback-info-500     { background-color: var(--color-feedback-info-500); }
.u-bg-feedback-info-700     { background-color: var(--color-feedback-info-700); }

.u-border-feedback-info-100 { border-color: var(--color-feedback-info-100); }
.u-border-feedback-info-500 { border-color: var(--color-feedback-info-500); }
.u-border-feedback-info-700 { border-color: var(--color-feedback-info-700); }

/* ─── Feedback – Negative ───────────────────*/
.u-color-feedback-negative-100  { color: var(--color-feedback-negative-100); }
.u-color-feedback-negative-500  { color: var(--color-feedback-negative-500); }
.u-color-feedback-negative-700  { color: var(--color-feedback-negative-700); }

.u-bg-feedback-negative-100     { background-color: var(--color-feedback-negative-100); }
.u-bg-feedback-negative-500     { background-color: var(--color-feedback-negative-500); }
.u-bg-feedback-negative-700     { background-color: var(--color-feedback-negative-700); }

.u-border-feedback-negative-100 { border-color: var(--color-feedback-negative-100); }
.u-border-feedback-negative-500 { border-color: var(--color-feedback-negative-500); }
.u-border-feedback-negative-700 { border-color: var(--color-feedback-negative-700); }

/* ─── Feedback – Positive ───────────────────*/
.u-color-feedback-positive-100  { color: var(--color-feedback-positive-100); }
.u-color-feedback-positive-500  { color: var(--color-feedback-positive-500); }
.u-color-feedback-positive-700  { color: var(--color-feedback-positive-700); }

.u-bg-feedback-positive-100     { background-color: var(--color-feedback-positive-100); }
.u-bg-feedback-positive-500     { background-color: var(--color-feedback-positive-500); }
.u-bg-feedback-positive-700     { background-color: var(--color-feedback-positive-700); }

.u-border-feedback-positive-100 { border-color: var(--color-feedback-positive-100); }
.u-border-feedback-positive-500 { border-color: var(--color-feedback-positive-500); }
.u-border-feedback-positive-700 { border-color: var(--color-feedback-positive-700); }

/* ─── Feedback – Warning ────────────────────*/
.u-color-feedback-warning-100  { color: var(--color-feedback-warning-100); }
.u-color-feedback-warning-500  { color: var(--color-feedback-warning-500); }
.u-color-feedback-warning-700  { color: var(--color-feedback-warning-700); }

.u-bg-feedback-warning-100     { background-color: var(--color-feedback-warning-100); }
.u-bg-feedback-warning-500     { background-color: var(--color-feedback-warning-500); }
.u-bg-feedback-warning-700     { background-color: var(--color-feedback-warning-700); }

.u-border-feedback-warning-100 { border-color: var(--color-feedback-warning-100); }
.u-border-feedback-warning-500 { border-color: var(--color-feedback-warning-500); }
.u-border-feedback-warning-700 { border-color: var(--color-feedback-warning-700); }

/* ─── Neutral scale ─────────────────────────*/
.u-color-neutral-50  { color: var(--color-neutral-50);  }
.u-color-neutral-100 { color: var(--color-neutral-100); }
.u-color-neutral-200 { color: var(--color-neutral-200); }
.u-color-neutral-300 { color: var(--color-neutral-300); }
.u-color-neutral-400 { color: var(--color-neutral-400); }
.u-color-neutral-500 { color: var(--color-neutral-500); }
.u-color-neutral-600 { color: var(--color-neutral-600); }
.u-color-neutral-700 { color: var(--color-neutral-700); }
.u-color-neutral-800 { color: var(--color-neutral-800); }
.u-color-neutral-900 { color: var(--color-neutral-900); }
.u-color-neutral-950 { color: var(--color-neutral-950); }

.u-bg-neutral-50  { background-color: var(--color-neutral-50);  }
.u-bg-neutral-100 { background-color: var(--color-neutral-100); }
.u-bg-neutral-200 { background-color: var(--color-neutral-200); }
.u-bg-neutral-300 { background-color: var(--color-neutral-300); }
.u-bg-neutral-400 { background-color: var(--color-neutral-400); }
.u-bg-neutral-500 { background-color: var(--color-neutral-500); }
.u-bg-neutral-600 { background-color: var(--color-neutral-600); }
.u-bg-neutral-700 { background-color: var(--color-neutral-700); }
.u-bg-neutral-800 { background-color: var(--color-neutral-800); }
.u-bg-neutral-900 { background-color: var(--color-neutral-900); }
.u-bg-neutral-950 { background-color: var(--color-neutral-950); }

.u-border-neutral-50  { border-color: var(--color-neutral-50);  }
.u-border-neutral-100 { border-color: var(--color-neutral-100); }
.u-border-neutral-200 { border-color: var(--color-neutral-200); }
.u-border-neutral-300 { border-color: var(--color-neutral-300); }
.u-border-neutral-400 { border-color: var(--color-neutral-400); }
.u-border-neutral-500 { border-color: var(--color-neutral-500); }
.u-border-neutral-600 { border-color: var(--color-neutral-600); }
.u-border-neutral-700 { border-color: var(--color-neutral-700); }
.u-border-neutral-800 { border-color: var(--color-neutral-800); }
.u-border-neutral-900 { border-color: var(--color-neutral-900); }
.u-border-neutral-950 { border-color: var(--color-neutral-950); }

/* ─── Brand Primary ─────────────────────────*/
.u-color-brand-primary-50  { color: var(--color-brand-primary-50);  }
.u-color-brand-primary-100 { color: var(--color-brand-primary-100); }
.u-color-brand-primary-200 { color: var(--color-brand-primary-200); }
.u-color-brand-primary-300 { color: var(--color-brand-primary-300); }
.u-color-brand-primary-400 { color: var(--color-brand-primary-400); }
.u-color-brand-primary-500 { color: var(--color-brand-primary-500); }
.u-color-brand-primary-600 { color: var(--color-brand-primary-600); }
.u-color-brand-primary-700 { color: var(--color-brand-primary-700); }
.u-color-brand-primary-800 { color: var(--color-brand-primary-800); }
.u-color-brand-primary-900 { color: var(--color-brand-primary-900); }
.u-color-brand-primary-950 { color: var(--color-brand-primary-950); }

.u-bg-brand-primary-50  { background-color: var(--color-brand-primary-50);  }
.u-bg-brand-primary-100 { background-color: var(--color-brand-primary-100); }
.u-bg-brand-primary-200 { background-color: var(--color-brand-primary-200); }
.u-bg-brand-primary-300 { background-color: var(--color-brand-primary-300); }
.u-bg-brand-primary-400 { background-color: var(--color-brand-primary-400); }
.u-bg-brand-primary-500 { background-color: var(--color-brand-primary-500); }
.u-bg-brand-primary-600 { background-color: var(--color-brand-primary-600); }
.u-bg-brand-primary-700 { background-color: var(--color-brand-primary-700); }
.u-bg-brand-primary-800 { background-color: var(--color-brand-primary-800); }
.u-bg-brand-primary-900 { background-color: var(--color-brand-primary-900); }
.u-bg-brand-primary-950 { background-color: var(--color-brand-primary-950); }

.u-border-brand-primary-50  { border-color: var(--color-brand-primary-50);  }
.u-border-brand-primary-100 { border-color: var(--color-brand-primary-100); }
.u-border-brand-primary-200 { border-color: var(--color-brand-primary-200); }
.u-border-brand-primary-300 { border-color: var(--color-brand-primary-300); }
.u-border-brand-primary-400 { border-color: var(--color-brand-primary-400); }
.u-border-brand-primary-500 { border-color: var(--color-brand-primary-500); }
.u-border-brand-primary-600 { border-color: var(--color-brand-primary-600); }
.u-border-brand-primary-700 { border-color: var(--color-brand-primary-700); }
.u-border-brand-primary-800 { border-color: var(--color-brand-primary-800); }
.u-border-brand-primary-900 { border-color: var(--color-brand-primary-900); }
.u-border-brand-primary-950 { border-color: var(--color-brand-primary-950); }