/* ================================================================
   CANJEADOR
   ================================================================ */

.canjeador-list {
  display:        flex;
  flex-direction: column;
  gap:            var(--space-3);
  margin-top:     var(--space-4);
}

.canjeador-item {
  display:        flex;
  flex-direction: column;
  gap:            var(--space-1);
  padding:        var(--space-4);
  background:     var(--bg-surface-2);
  border:         1px solid var(--border-subtle);
  border-radius:  var(--radius-md);
  transition:     border-color var(--transition-fast);
  animation:      fadeInUp var(--duration-normal) var(--ease-out) both;
}

.canjeador-item:hover { border-color: var(--border-default); }

.canjeador-item-title {
  font-size:   var(--text-md);
  font-weight: var(--weight-semibold);
  color:       var(--text-primary);
  margin:      0;
}

.canjeador-item-meta {
  font-size: var(--text-xs);
  color:     var(--text-muted);
  margin:    0;
}

.canjeador-btn {
  align-self:    flex-start;
  margin-top:    var(--space-2);
  padding:       8px 20px;
  border-radius: var(--radius-full);
  background:    var(--gradient-primary);
  color:         var(--text-on-color);
  border:        none;
  font-size:     var(--text-xs);
  font-weight:   var(--weight-semibold);
  cursor:        pointer;
  box-shadow:    0 2px 10px var(--color-primary-glow);
  transition:    transform var(--transition-fast), filter var(--transition-fast), box-shadow var(--transition-fast);
}

.canjeador-btn:hover:not(:disabled) {
  filter:     brightness(1.1);
  transform:  scale(1.04);
  box-shadow: 0 4px 20px var(--color-primary-glow);
}

.canjeador-btn:active:not(:disabled) { transform: scale(0.97); }

.canjeador-btn:disabled {
  background:  var(--bg-surface-2);
  color:       var(--text-muted);
  cursor:      not-allowed;
  box-shadow:  none;
  border:      1px solid var(--border-subtle);
}